HTML 줄바꿈 태그- 단락 나누기(p, br, pre, hr)

이번 시간에는 html의 글자 사이에 단락을 만들어 줄을 바꿈으로써
문장을 구분하는 방법에 대해서 알아보겠습니다.

 

1. <p> 태그

p 태그는 기본적인 단락을 만들어주는 기능을 합니다.
p 태그를 사용하게되면 문장 위쪽과 아래쪽에 약간의 여백이 생기게 됩니다.

HTML 코드에서 띄어쓰기나 줄을 변경하려고 아래와 같이 입력하여도
화면에서는 한번의한 번의 띄어쓰기와 한 번의 줄 바꿈으로 인식하니 주의하세요.

<p>1 단락입니다. 위아래로 약간의 여백이 들어갑니다 </p>
<p>2 단락입니다. 위아래로 약간의 여백이 들어갑니다</p>
<p>3 단락입니다.    
     위아래로         약간의 
     여백이 들어갑니다</p>

 

 

2. <br> 태그   

br 태그는 단락을 나누는 기능을 수행합니다.
종료 태그가 없으며 문장의 끝에 단독으로 사용합니다.

<p> 
    줄 바꿈 코드 작성 1 <br>
    줄 바꿈 코드 작성 2 <br>
    줄 바꿈 코드 작성 3 
    줄 바꿈 코드 작성 4 
</p>

 

 

3. <pre> 태그  

pre 태그는 내가 작성한 문장 그대로 표현해주는 기능을 합니다.
문장을 변경하거나 한개 이상의 띄어쓰기를 실행할 경우 사용합니다.

<pre>
    줄 변경 작업입니다.
    


    작성한 대로 줄이 변경됩니다.

    띄워   쓰기도   여러 개가   가능합니다.
</pre>

4. <hr> 태그   

 hr 태그는 문장과 문장사이에 단락을 가로의 수평선으로 표시해주는 기능을 합니다.

<p> 수평선을 그려보자 1 </p>

<hr>

<p>수평선을 그려보자 2 </p>

이상으로 HTML의 문장과 문장의 단락을 나누는
p, br, pre, hr 태그에 대해서 알아보았습니다.