HTML 5 : <br>, <br/> 또는 <br />입니까?

다른 답변을 확인하려고했지만 여전히 혼란 스럽습니다. 특히 W3schools HTML 5 참조를 본 후에는 혼란 스럽습니다 .

HTML 4.01이 단일 태그를 " <img>및 "로 "허용"한다고 생각했습니다 <br>. 그런 다음 XHTML은 함께 온 <img />과 <br />( 누군가가 공간이 오래된 브라우저가 있다고 말했다 경우 ).

이제 HTML 5를 연습 할 때 코드를 어떻게 형식화해야하는지 궁금합니다.

그것은인가 <br>, <br/>또는 <br />?

간단합니다 <br>.

다른 형태는 XHTML과의 호환성을 위해 존재합니다. XHTML과 동일한 코드를 작성하고 HTML로도 작동하도록 할 수 있습니다. HTML을 생성하는 일부 시스템은 XML 생성기를 기반으로 할 수 있으므로 베어 <br>태그 만 출력 할 수 없습니다 . 그러한 시스템을 사용하는 경우 사용 <br/>하는 것이 좋습니다. 필요하지 않은 경우에는 필요하지 않습니다.

그러나 실제로 XHTML을 사용하는 사람은 거의 없습니다. application/xhtml+xmlXHTML로 해석 될 수 있도록 콘텐츠를 제공해야 하며 이는 이전 버전의 IE에서는 작동하지 않습니다. 또한 작은 오류로 인해 XHTML을 지원하는 브라우저에 페이지가 표시되지 않을 수도 있습니다. 따라서 웹에서 XHTML처럼 보이는 것의 대부분은 실제로 HTML로 제공되고 해석됩니다. 자세한 내용은 XHTML을 텍스트 / html로 간주하여 유해 함 을 참조하십시오.

HTML 5 Reference Draft 의이 인용문이 답을 제공 한다고 생각합니다 .

공허 요소

void 요소 라는 용어 는 비어 있어야하는 요소를 지정하는 데 사용됩니다 . 이러한 요구 사항은 HTML 구문에만 적용됩니다. XHTML에서 이러한 모든 요소는 일반 요소로 취급되지만 빈 요소로 표시되어야합니다.

이러한 요소는 콘텐츠를 전혀 포함 할 수 없습니다. HTML에서 이러한 요소에는 시작 태그 만 있습니다. 자동 폐쇄 태그 구문을 사용할 수있다. 끝 태그 요소가 자동 분석기에 의해 폐쇄되어 있기 때문에 생략한다.

HTML 예 :
HTML 구문의 void 요소 XHTML 구문에서는 허용되지 않습니다.

<hr>

예 :
HTML 및 XHTML 호환 자체 닫기 태그 구문을 사용하는 void 요소

<hr/>

XHTML 예 :
명시적인 종료 태그와 함께 XHTML 전용 구문을 사용하는 void 요소 HTML 구문에서 void 요소에는 허용되지 않습니다.

<hr></hr>

XML은 태그를 열어 두는 것을 허용하지 않으므로 <br>다른 두 개보다 약간 나쁩니다. 다른 두 가지는 <br/>이전 브라우저와의 호환성을 위해 선호되는 두 번째 ( ) 와 거의 같습니다 . 실제로 /호환성을 위해 이전의 공백 이 선호되지만 속성이있는 태그에만 적합하다고 생각합니다. 그래서 당신의 미학을 기쁘게 하는 <br/>또는 <br />중 하나를 말할 것 입니다.

요약하면 : 세 개 모두 유효하며 첫 번째 ( <br>)는 "덜 이식 가능"합니다.

편집 : 이제 우리는 사양에 열광하므로 dev.w3.org 에 따르면 지적 할 가치가 있다고 생각합니다 .

시작 태그는 다음과 같이 정확하게 다음 순서로 구성됩니다.

1. "<"문자
2. 요소의 태그 이름
3. 선택적으로 하나 이상의 속성이 있으며 각 속성 앞에 하나 이상의 공백 문자가 와야합니다.
4. 선택적으로 하나 이상의 공백 문자.
5. 선택적으로, "/"문자는 요소가 void 요소 인 경우에만 존재할 수 있습니다.
6. ">"문자

에서 HTML (최대 HTML 4) : 사용<br>

에서는 HTML 5 : <br>선호되지만 <br/>및 <br />도 허용

XHTML 에서는 : <br />선호합니다. 또한 사용할 수 <br/>또는<br></br>

노트:

• <br></br> HTML 5에서는 유효하지 않으며 두 줄 바꿈으로 간주됩니다.
• XHTML은 대소 문자를 구분하며 HTML은 대소 문자를 구분하지 않습니다.
• 이전 버전과의 호환성을 위해 일부 이전 브라우저는 XHTML을 HTML로 구문 분석하고 실패 <br/>하지만 실패했습니다.<br />

참고:

• http://www.w3schools.com/tags/tag_br.asp
• http://en.wikipedia.org/wiki/XHTML

사양 에 따르면 예상되는 형식은 <br>HTML 5 용이지만 닫는 슬래시가 허용됩니다.

<br />다음과 같은 이유로 사용 하는 것이 좋습니다 .

1) 다른 색상으로 XML 구문을 강조 표시하는 텍스트 및 XML 편집기는 올바르게 강조 표시 <br />되지만 사용하는 경우 항상 그런 것은 아닙니다<br>

2) <br />XHTML과 하위 호환이 가능하며 올바른 형식의 HTML (예 : XHTML)은 종종 오류 및 디버그에 대한 검증이 더 쉽습니다.

3) 일부 오래된 파서 및 일부 코딩 사양에는 WordPress 플러그인 코딩 사양과 같은 닫는 슬래시 앞에 공백이 필요합니다 (예 : <br />대신 <br/>) : http://make.wordpress.org/core/handbook/coding-standards/html/

내 경험에 따르면 사용 <br />에 문제가있는 경우를 보지 못했지만 이전 브라우저와 도구에 문제가 <br/>있거나 특히 <br>문제가 될 수있는 경우가 많습니다 .

XML을 사용하려면 모든 태그에 해당하는 닫기 태그가 있어야합니다. 따라서 내부 내용이없는 태그에 대한 특별한 속기 구문이 있습니다.

HTML5는 XML이 아니므로 그러한 요구 사항을 제기해서는 안됩니다. HTML 4.01도 아닙니다.

예를 들어 HTML5 specs 에서 br태그가있는 모든 예제는 <br>not 구문을 사용 합니다 <br/>.

UPD 실제로 HTML5<br/> 에서는 허용됩니다 . 9.1.2.1, 7.

비교 가능성 (호환성이 아니라 비교 가능성)에 관심이 있다면을 고수 할 것입니다 <br />.

그렇지 않으면 <br>괜찮습니다.

모두 <br>와 <br />HTML5에 허용하지만, HTML의 정신에 <br>사용되어야한다. HTML5를 사용하면 슬래시를 닫아 이전에 HTML 4.01 및 XHTML 1.0이었던 문서와보다 호환되므로 HTML5로 쉽게 마이그레이션 할 수 있습니다. 물론 <br/>허용되지만, 일부 구형 브라우저와 호환 되려면 닫는 슬래시 ( /) 앞에 공백이 있어야합니다 .

1. 당신은 정기적으로 웹 사이트에 출력 HTML 경우에 당신은 사용할 수 있습니다 <br> 또는 <br/> 모두는 text / html과 같은 HTML5를 제공하는 유효한 언제 있습니다.

2. HTML5를 XHTML (예 : 콘텐츠 유형 application / xhtml + xml, XML 선언 포함)로 제공하는 경우 다음과 같이 자체 닫는 태그를 사용해야합니다 <br/>.

   그렇지 않으면 일부 브라우저에서 페이지 렌더링을 거부 할 수 있습니다 (특히 Firefox는 유효한 xhtml + xml 페이지 만 렌더링하는 것이 매우 엄격합니다).

   1에서 언급했듯이 <br/>XML로 생성되지만 XML 선언이 없는 일반 텍스트 / html (예 : 웹 페이지를 생성하는 XSL 변환 등)로 제공되는 HTML5에도 유효합니다 .

혼란을 없애기 위해 : HTML5에서는 슬래시 앞에 공백을 넣을 필요가 없으며 페이지 렌더링 방식에 아무런 영향을 미치지 않습니다 (누군가가 예제를 인용 할 수 있다면 이것을 철회 할 것이지만 나는 그것을 믿지 않습니다) true-그러나 IE는 확실히 모든 형태의 <br>태그 로 많은 다른 이상한 일을 합니다).

http://validator.w3.org 의 훌륭한 유효성 검사기는 유효한 내용을 확인하는 데 실제로 도움이됩니다 (콘텐츠 유형을 확인하기 위해 의존 할 수는 없지만).

모두 <br>와 <br/>잘 수행하지만 선호 <br/>는 좀 더 논리적이기 때문에. 여는 태그가있을 때마다 닫는 태그를 기대하는 것이 합리적입니다. 따라서 닫는 태그가 없을 때 여는 태그를 사용하지 않으면 코드를 조금 더 쉽게 읽을 수 있습니다.

모든 브라우저 (중요하지 않은 아주 오래된 브라우저는 제외)는 모두 동일하게 표시됩니다. 그러나 <br>xHTML을 준수하지 않습니다.

<br>과 <br/>다르게 렌더링합니다. 일부 브라우저는 두 줄 바꿈 <br/>으로 해석 <br></br>하여 삽입

<br>충분하지만 XHAT에서는 WHATWG 및 W3C에 따라<br /> 선호 됩니다 .

인용 섹션 8.1.2.1을 의 2017 12 월 14 일 HTML 5.2 W3C 권고안

시작 태그는 다음 형식이어야합니다.

…

5. 속성 뒤에 또는 속성이없는 경우 태그 이름 뒤에 공백 문자가 하나 이상있을 수 있습니다. (일부 속성 뒤에 공백이 있어야합니다. 아래의 §8.1.2.3 속성 참조)

6. 그런 다음 요소가 void 요소 중 하나이거나 요소가 외래 요소 인 경우 단일 U + 002F SOLIDUS 문자 (/)가있을 수 있습니다. 이 문자는 void 요소에는 영향을 미치지 않지만 외부 요소에는 시작 태그를 자체 닫기로 표시합니다.

Dreamweaver CS6를 사용하면로 자동 완성됩니다 <br />.

W3C에서 HTML 파일을 확인하려면 http://validator.w3.org/를 참조하십시오.

이 질문의 유효성 검사에서 실제로는 !DOCTYPE확인하려는 대상 에 따라 다릅니다 .

내가 가장 좋아하는 4.01 Trans곳은 내가 사용하는 곳 <br/>이며 유효성 검사 중에 발생할 수있는 경고 및 오류를 지 웁니다.

Strict는 훨씬 더 복잡한 짐승입니다. HATES "SHORTTAGS"이며 말 그대로<br></br>

에서 HTML5또는 코드 세계의 "LAX"정말 때문에 그것이 정답이없는 detects every example you put up이 올바른로 ......

결국, 나는 문제의 모든 생각 is what validation YOU PREFER이나 the person that you are working for prefers와 ... lackadaisical코드 엄격에서 운동에서 html5우리는 매우 LAZY 코더보고있다

IMHO 다음과 같은 이유로 용서 표기법 ( ) <br />대신 정규 표기법 ( ) 을 사용하는 것이 좋습니다 .<br>

일관성

HTML에는 아마도 일부 SVG 및 SVG가 정규 표기법 만 지원합니다 (예 :) <rect />.

해킹

React 및 NativeScript 와 같은 프레임 워크 가 XML 표기법을 사용하는 경우는 아닙니다 .
마크 업 코드를 더 쉽게 파싱 할 수 있습니다.

명쾌함

규칙적인 표기법은 밤 늦게도 읽고 이해하기가 더 쉽습니다.

명세서

모두 <br>와 <br />유효한 HTML 태그입니다.

결론

본격적인 텍스트 편집기를 사용하는 경우 정규 표기법 ( Emmet에 의해 XHTML이라고 함)을 사용하도록 구성하십시오 .
예를 들어 Visual Studio Code 에서는 설정에 다음 줄을 추가하기 만하면됩니다.

"emmet.syntaxProfiles": {"html": "xhtml"}

내가 아는 것은 <br />흰색 선 <br>으로 휴식을 취하고 경우에 따라 휴식을 취하는 것입니다. IPN 스크립트 (PHP)를 설정하고 메일을 보내서받은 편지함을 확인할 때 이런 일이 일어났습니다. 왜 그런지 모르겠지만 둘 다 깔끔하게 보이도록 메시지를 받았습니다.<br /> and <br>

여기에있는 메일을보십시오 : http://snag.gy/cLxUa.jpg

텍스트의 처음 두 섹션은으로 구분 <br />되므로 공백 줄, 맨 아래의 마지막 세 행 및 마지막 섹션은 구분되어 <br>새 행을 제공합니다.

HTML <br>과 XHTML에서 <br/>.

나는 당신이 사용하는 것이 좋습니다 <br/>.

많은 사람들이 덮여 것처럼, 모두 <br>와이 <br/>허용됩니다.

트레이드 오프는 <br/>최종 사용자에게 하나의 적은 문자를 보내는 것과 비교 하여 더 나은 가독성과 이전 버전과의 호환성이라고 생각합니다 <br>.

그리고 구글도<br> 그렇게 사용 하기 때문에.

(물론 <br>그들이 지원하는 Chrome을 사용하고 있기 때문에 그들이 나를 섬길 수 있음을 명심 하십시오. IE에서는 여전히 서비스를 제공 할 수 있습니다 <br/>)

<br>잘 작동합니다. XHTML과 같은 엄격한 버전은 당신이 포함되지 않습니다 폐쇄하고, HTML의 정말 오래된 버전의 추가 요구 DOCTYPE메이크업을 <br>같이 void 이외의 태그를 <br></br>.

요약 : <br>괜찮습니다. 다른 것도 괜찮습니다.

에서 HTML5 슬래시가 더 이상 필요하지 않습니다 : <br>,<hr>

HTML에서 대부분의 경우 태그는 쌍으로되어 있습니다. 그러나 줄 바꿈을 위해서는 한 쌍의 태그가 필요하지 않습니다. 따라서이를 나타 내기 위해 HTML은 <br/>형식을 사용 합니다. <br/>맞습니다. 해당 형식을 사용하십시오.

<br>태그에 HTML에 종료 태그가 없습니다. XHTML에서 다음과 같이 <br>태그를 올바르게 닫아야합니다.<br />

XML에서는 모든 태그를 닫아야합니다. XHTML은 XML의 확장이므로 유효한 XHTML을 위해서는 모든 XML 규칙을 따라야합니다. 따라서 빈 태그 (자식 노드가없는 노드)
도 닫아야합니다. XML에는 빈 노드에 대한 자체 닫기 태그라는 짧은 형식이 있습니다. 당신은 쓸 수 있습니다 <br></br> as <br />. 따라서 XHTML <br />에서는 사용됩니다.

이와 관련하여 HTML은 매우 관대하며 그러한 규칙은 없습니다. 따라서 HTML에서 빈 노드 <br> <hr> <meta>등은 슬래시없이 닫힙니다.

HTML

<br>
<hr>
<meta name="keywords" content="">
<link rel="canonical" href="http://www.google.com/">

XHTML

<br />
<hr />
<meta name="keywords" content="" />
<link rel="canonical" href="http://www.google.com/" />

모든 태그를 자동 폐쇄 할 수있는 것은 아닙니다. 예를 들어 <script src="jQuery.min.js" />XHTML DTD에서는 이와 같은 태그를 사용할 수 없습니다.

Ummm ..... 누구든지 W3C 사양을 100 % 준수한 단일 공급 업체, 사용자 에이전트 또는 브라우저 제조업체를 알고 있습니까? 따라서 HTML5가 세 가지 구분 요소 버전을 모두 지원한다고하면 공급 업체가 더 똑같은 버전을 지원할 수 있습니다.

이 토론에서 중요한 것은 가능한 경우 HTML 사양뿐만 아니라 XML 사양도 따르는 코딩을 일관되게 사용하는 것입니다. 즉, 올바른 XML 버전의 구분 태그를 사용해야하고 모든 팀이 동일한 작업을 수행하도록 권장해야합니다.

<br />

코드에서 img, a, hr 및 meta 태그에 동일한 공백 슬래시 형식이 적용되어야합니다. 왜? 때문에:

1. 이전 XHTML 사용자 에이전트 / 브라우저와 호환됩니다.
2. 브라우저 공급 업체는 어쨌든 XML 버전을 지원하므로 HTML5 사양에 문제가 없습니다.
3. 오늘날, 과거 및 미래에 대부분의 사용자 에이전트의 부실한 구현이이를 수용 할 것입니다.
4. 마크 업에서 XHTML / XML 문서 작성으로 돌아 가야하는 경우 마크 업을 XML 표준과 비교할 수 있습니다.
5. 모든 웹 개발자는 모든 소문자 코딩, 인용 속성, 이스케이프 XML 문자 등 XML을 따르는 견고한 마크 업 방법을 계속 사용하는 것이 "좋은 코딩 방법"입니다. 왜 그렇습니까? 앞으로 XML 데이터로 전환해야하는 경우 자동으로 XML로 코딩하고 생각합니다.
6. 우리는 미래의 월드 와이드 웹에서 개인 벤더 구현 표준에서 벗어나 더 빨리 구문 분석하고 데이터를 더 빠르게 유선으로 이동하며 미래의 인터넷을보다 표준화 된 견실하고 신뢰할 수있는 검증 된 마크 업으로 되돌아 가기를 희망 할 수 있습니다. XML을 사용하는 매체.

또한 로봇이 기계와 같은 인간 인터페이스 코딩 문제를 해결하지 못하는 로봇과 머신 세계에서 XML5로 해결하면 기꺼이 XML 데이터 시스템으로 돌아가서 XML로 변환 할 때 UI 웹 페이지를 훨씬 빠르게 파싱합니다. 데이터.

모두 <br>와 <br/>작동하지만 HTML 5도 쉽습니다 첫 번째 구문을 지원하기 때문에 두 번째를 사용할 필요가 없다

HTML5에서 잘 작동합니다. HTML5는 XHTML보다 약간의 여유를 허용합니다

HTML5를 사용 <br>하는 경우 사용하는 것이 올바른 방법입니다. :)

<br>그리고 <br />자신 또는에 대한 추가 작업을 초래할 수있는 페이지가 일부 브라우저의 렌더링에 영향을 대량 find..replace을 기대하는 프로젝트를 다치게하지만,하지 않을 것입니다 그래서 다른 이상 중 하나를 선택, 일부 브라우저에서 다르게 렌더링 변경 사항이 테스트 브라우저에서는 아무런 영향을 미치지 않지만 당황하는 것은 고객의 선호하는 브라우저에서 깨뜨리는 것입니다.

<br>Erwise와 Netscape Navigator (이전의 웹 브라우저) 이후로 사용했던 것이므로 선호 하지만 <br />대신 선택하지 않는 이유는 없습니다 . 일부 전처리, 비교 가능성 등에 유용 할 수 있습니다.

당신의 선택이 다른 것보다 하나의 모양을 선호하는 것처럼 보일지라도, 또는 당신 (또는 Dreamweaver와 같은 좋아하는 HTML 편집기)은 코드가 XML을 준수하는 것을 좋아할 것입니다. 그것은 당신에게 달려 있습니다.

간단한 참고 사항 :

와 혼동하지 말고 HTML에 태그 br사용을 고려할 수도 있습니다 wbr. 단어 구분 기회 태그는 텍스트에서 줄 바꿈을 추가 할 위치를 지정합니다.

자세한 내용을 보려면 HTML5 사양을 읽으십시오 .

종료 태그가없는 요소를 빈 태그라고합니다. html 4 및 html 5에서 종료 태그는 필요하지 않으므로 생략 할 수 있습니다.

xhtml에서 태그는 매우 엄격합니다. 즉, 시작 태그로 시작하고 종료 태그로 끝나야합니다.