[줄바꿈] 태그 : br, hr

문단 내 줄바꿈 태그 : <br />

밑줄 태그 : <hr />

문단과 문단은 <p></p> 태그로 구분이 된다. <p> 태그로 묶인 내용은 하나의 문단을 이루며 문단끼리는 줄바꿈이 된다. 워드에서 엔터를 쳐서 다음 줄로 내려가는 것과 동일하다. 문서 작성 중에 엔터를 치면 앞 문단과 '문단간격'이 벌어지고 들여쓰기가 되면서 새로운 문단이 시작된다. 그런데 문단 내에서도 줄바꿈이 필요할 때가 있다. 워드에서는 Shift+Enter를 쳐서 줄을 바꾼다. 문단 내에서 줄을 바꾸게 되면 문단 간격이 아닌 '줄간격' 만큼 간격이 벌어지고 들여쓰기가 적용되지 않는다. 

HTML에서 이런 역할을 하는 태그가 <br />태그다. <br />은 문단 내에서 줄을 바꿀 필요가 있을 때 사용한다. HTML은 엔터키로 줄을 많이 내리더라도 모두 무시하기 때문에  문단 내에서 줄을 바꿀 필요가 있을 때에는 <br />태그를 사용한다.

<hr />은 위쪽과 아래쪽을 구분할 때 사용한다. 문단과 문단 사이, 혹은 문단 내에서 가로로 줄을 그어 위쪽과 아래쪽을 구분할 수 있다. 

<br /> 태그와 <hr />태그는 닫는 태그 없이 단독으로 사용한다. HTML에서는 <br>, <hr>처럼 슬래시(/) 없이 사용할 수 있고 XHTML에서는 <br />처럼 여는 태그이면서 동시에 닫는 태그임을 표시해주는 슬래시(/)를 넣어야 한다. EPUB은 XHTML을 기반으로 하기 때문에 <br />처럼 닫아주는 것이 좋다.

◈ <br /> <hr /> 태그 문법 ◈

<p> &lt;br /&gt;태그는 <br> 줄을 바꿀 때 사용합니다.</p>

<p>

&lt;br /&gt;태그 없이 

엔터로 줄을 바꾸면

◆

HTML은 

줄바꿈을 

무시합니다.

<p>&lt;hr /&gt;태그를 사용하면 아래처럼 가로 줄이 생겨 위쪽 내용과 아래쪽 내용을 구분할 수 있습니다.</p>

<hr />

<p>&lt;hr /&gt;태그는 문단과 문단 사이에 주로 사용합니다.</p>

br_hr_tag_sample.html

◈ 편집에 적용한 예 ◈

<p>문단과 문단을&lt;p&gt; &lt;/p&gt; 태그로 묶으면 자동으로 줄바꿈을 합니다. 하지만 동일한 문단 내에서 줄바꿈이 필요할 경우가 있습니다. <br>같은 문단이지만 줄을 바꿔야 할 때 &lt;br /&gt; 태그를 사용합니다.</p>

<hr />

<p>&lt;hr /&gt; 태그는 위쪽 내용과 아래쪽 내용을 구분하고 싶을 때 사용합니다. 본문 내에 가로줄을 그어 내용을 구분하거나 꾸밀 필요가 있을 때 유용합니다</p>

br_hr_tag_style_sample.html

* 문법과 예는 복사해서 html 파일에 붙이면 결과를 확인할 수 있습니다.

* 첨부된 *sample.html 파일을 다운로드 해서 웹브라우저로 열어도 태그가 적용된 내용을 확인할 수 있습니다.