HTML5가 코드 요소를 pre 안에 넣을 것을 권장하는 이유는 무엇입니까?

HTML5가 코드 요소를 pre 안에 넣을 것을 권장하는 이유는 무엇입니까?

---

HTML5 문서 는 code요소를 요소 안에 넣을 것을 권장pre 하지만 이것이 코드 요소와 CSS를 사용하는 것보다 더 낫거나 더 의미가 있는지 이해하지 못합니다. 자신의 예에서 :

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

다음과 같이 쓸 수도 있습니다 (의 브라우저 기본값에 대한 몇 가지 가정 pre).

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

pre코드 블록 을 코드 의 인라인 문자열 과 구별하기 위해 존재 하더라도 클래스에서 블록 성 을 지정하는 것보다 더 의미 론적 선택이라고 생각하지 않습니다 code.

preCSS 솔루션보다 권장 되는 특별한 이유 가 있습니까?

---

<code>단지 "컴퓨터 코드 조각"을 나타냅니다 . 원래는 같은 간단한 코드 조각에 대한 생각되었다 i++나 <code>.

<pre> "구조가 요소가 아닌 인쇄 규칙에 의해 표현되는 사전 서식이 지정된 텍스트 블록을 나타냅니다 . " . 원래 목적은 정확히 이것에 불과했습니다. 저자가 제공 한 것과 동일한 방식으로 텍스트를 제공하십시오.

+ ---------------------------------- +
| |
| 경고! 미리 형식화 된 텍스트가 있습니다! | = o =
| __; ~ ^
+ ---------------- TT ------------ °
                 || _____________ _____________________
                 || | GRANDMA로> | 완전히 함정이 아닙니다>
  oÖo || | °°°°°°°°°°°° °°°°°°°°°°°°°°°°°°°°°          
   | ö || | | .mm,                    
~ "" "~" ""~ "" "~" ""~ "" "~" ""~~ "" "~" ""~ "" "~" ""~ "" "~" ""~ "" "~" ""~ "" "~" ".. MWMWc ... ~" ""~ ""

서로를 사용할 필요가 없습니다. <pre>자신의 역할 <code>이 있습니다. 그러나 <pre>주어진 조각의 공백이 중요하다는 신호를 보내는 방법 <code>은 누락 된 역할입니다 .

그러나 귀하의 질문으로 돌아가서 정확한 문구에 유의하십시오 .

코드 블록은 방법 다음 예를 보여주는 수 사용하여 표시 pre하고 code소자.

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

이 예제에서는 사용 된 언어를 나타 내기 위해 클래스가 사용됩니다.

그것은 말했다 수 , 아니 해야한다 . 원하는 방식으로이 작업을 수행 할 수 있습니다. W3C에서는 어떤 방식으로도 권장하지 않지만 개인적으로 <pre><code>....

추가 설명

공백이 코드 및 코드 구조의 일부일 때마다이 구조를 유지해야 함을 명시해야합니다. 코드의 구조 표기법 (탭, 줄 바꿈 공백)에 의해 제공되기 때문에 나는 개인적으로 사용하는 것이 좋습니다 <pre><code>는 틀림없이 더 많은 코드와 DOM의 다른 노드가 경우에도. 그러나 공백이 누락되면 코드가 불완전 해 질 때마다 필요합니다.

그 외에도 인라인 코드와 코드 블록을 확인하지 않고도 쉽게 다를 수 element.className있으며 일부 JS 구문 하이 라이터 <pre><code>...는 <code>자동으로 잘 작동 하고 제거 됩니다.

또한 <code>with white-space:pre;에 대한 일반 규칙을 사용하는 경우 추가 클래스가없는 인라인 스 니펫에는이를 사용할 수 없습니다. 대신 클래스를 만들면 <pre><code>.

참고 문헌

• W3C : HTML5 : 4.5.12 코드 요소 (W3C 권장 사항 2014 년 10 월 28 일)

  code요소 나타내는 컴퓨터 코드의 단편. 이것은 XML 요소 이름, 파일 이름, 컴퓨터 프로그램 또는 컴퓨터가 인식 할 수있는 기타 문자열 일 수 있습니다.

• W3C : HTML5 : 4.4.3 사전 요소 (W3C 권장 사항 2014 년 10 월 28 일)

  pre요소 나타내는 구조로 표기 규칙이 아닌 요소들에 의해 표현되는 프리 포맷 텍스트 블록.

---

CSS is for presentation.

White space is significant (not presentational) in many programming languages.

---

To represent a block of computer code, the pre element can be used with a code element;

To represent a block of computer output the pre element can be used with a samp element.

<pre><code> for block code that must not wrap. Use <code> for inline code that can wrap.

Line breaks and white spaces in the text enclosed within the <pre> tags is maintained as it is in the html document when displays on the browser.Browsers normally render <pre> text in a fixed-pitched font, with whitespace.

---

<pre> shows line breaks!

This prevent you using php function such as nl2br() or adding manually <br /> at every line end.

Regards, Ghost

참고URL : https://stackoverflow.com/questions/11742907/why-does-html5-recommend-putting-the-code-element-inside-pre