The HTML5 documentation recommends pre öğesi içinde code öğe koyarak, ama bu daha iyi ya da sadece kod öğesi ve CSS kullanarak daha fazla anlam olduğunu nasıl anlamıyorum. Kendi örnek:

<pre><code class="language-pascal">var i: Integer;
begin
   i := 1;
end.</code></pre>

Da yazılabilir (pre için tarayıcının varsayılan ayarları hakkında bazı varsayımlar Yaparak):

<style>
code {
    display: block;
    white-space: pre;
}
</style>
…
<code class="language-pascal">var i: Integer;
begin
   i := 1;
end.</code>

Eğer pre bir kod ayrım varsa bileblokkod bir satır içi dizeden, belirtme daha çok semantik bir seçim olarak görmüyorumblok-nessbir sınıfta code.

pre CSS bir çözüm önerilir özel bir nedeni var mı?

<code> sadece bir temsil< . em ^"bilgisayar kod parçası". Aslında i <code> gibi basit kod parçacıkları için düşünüldü.

<pre>< . em ^"önceden biçimlendirilmiş bir metin bloğunu temsil eden unsurlar tarafından tipografik kurallarına göre yerine temsil edilen". Tam olarak bu başka bir şey değildi. asıl amaç: yazar, örneğin . tarafından verildi aynı şekilde bir metin sağlamak

 ---------------------------------- 
|                                  |
| WARNING! PREFORMATED TEXT AHEAD! |                      =o=
|                               __;                                  ~^
 ----------------TT------------°
                 ||    _____________    _____________________
                 ||    | TO GRANDMA  >  | TOTALLY NOT A TRAP  > 
  oÖo            ||    |°°°°°°°°°°°°    °°°°°°°°°°°°°°°°°°°°°          
   |  ö          ||    |                |      .mm,                    
~"""~"""~"""~"""~"""~"""~~"""~"""~"""~"""~"""~"""~"""~"""~"""~""..MWMWc...~"""~""

Birbirleri ile her kullanmana gerek yok. <pre> <code> kendi gibi kendi rolleri var. Ancak, <pre> verilen kısımda boşluk önemli olduğunu signalize için bir yoldur, 19* *bir rolü kayıp.

Ancak, sorunuza geri: notkesinifade:

Aşağıdaki örnek, nasıl bir kod bloğu gösterirolabilirön kullanarak ve kod öğeleri Yukarı işaretlenir.

<pre><code class="language-pascal">var i: Integer;
begin
   i := 1;
end.</code></pre>

Bir sınıf bu örnekte kullanılan dili belirtmek için kullanılır.

Yazıyorolabilirdeğilgerekir. Nasıl istiyorsanız, bunu yapmak için özgürsünüz. Herhangi bir şekilde W3C tarafından, ancak tavsiye değil, ben şahsen seni <pre><code>... kullanmanızı öneririz.

Daha fazla açıklama

White-space kod ve kod yapısının bir parçası olduğunda, bu yapı tutulması gerektiğini belirtiyor. Kod olarak yapısı (sekmeler, satır beslemeleri, boşluk) tipografik kuralları tarafından verilirşahseneğer muhtemelen daha fazla kod varsa bile <pre><code>, kullanmak için tavsiye ve DOM başka bir düğüm. Ama her boşluk eksik kodunuzu gerekli kusurlu hale getirecektir.

Bunun dışında kolay element.className ve bazı JS sözdizimi vurgulayıcı oldukça iyi <pre><code>... ile çalışmak ve <code> şerit otomatik olarak kontrol etmeden kod ve kod blokları satır içi arasında farklılık olabilir.

Eğer white-space:pre; ile <code> genel bir kural kullanıyorsanız ayrıca, ek dersler olmadan içi parçacıkları için bunu kullanamaz. Eğer bir sınıf oluşturmak yerine, <pre><code> kıyasla hiçbir şey kazanmadın.

Referanslar

• W3C: HTML5: 4.6.11 The code element (- html5-WD 20120329)

  code eleman represents bilgisayar kodunun bir parçası. Bu XML öğesi, bir adı, bir dosya, bir bilgisayar programı ya da bir bilgisayar kabul edeceği diğer herhangi bir dize olabilir.

• W3C: HTML5: 4.5.3 The pre element (- html5-WD 20120329)

  Hangi yapı elemanları tarafından tipografik kurallarına göre yerine temsil edilir önceden biçimlendirilmiş metin, 35 ** pre elemanın bir blok.