오늘 배워볼 태그는 바로 <p>태그인데요. p 태그는 paragraphs의 약자입니다. p 태그를 사용하실 땐 꼭 새줄에서 시작해야하며, 한번 사용 하면 텍스트들을 묶는 블록이 됩니다.
<p> 태그 같은 경우 아래와 같이 코드 상 줄을 바꾸거나 여백을 심하게 넣는다고 하더라도, 브라우저가 페이지를 표시할 때 공백과 줄을 제거하기 때문에 효과를 볼 수 없습니다.
<p>태그 삽입 예시
위 예시의 결과값은 아래와 같은데요. 코딩 상 컨텐츠의 줄을 바꾸거나 띄어쓰기를 심하게 넣어도, 결과값은 아래와 같습니다.
02. <br>태그에 대해서 배워보자
<br>태그 예시
<p>태그와 함께 많이 사용하는 태그는 바로 <br>태그가 있는데요. <br>태그는 줄바꿈을 할때 사용하는데요. 브라우저는 삽입된 <br>태그를 기준으로 줄을 바꿔줍니다. 위 예시를 보면, <p> 태그 안에 <br>태그가 들어가 있는데요. <br>태그를 기점으로 컨텐츠의 줄바꿈이 가능해집니다. 아래 결과값을 한번 살펴볼까요? 결과값은 아래와 같이 <br>태그를 기점으로 줄이 바꼈습니다.
03. <hr>태그에 대해서 알아보자
<hr>태그는 컨텐츠를 분리하는데 사용되는 태그입니다.
<hr>태그 사용 예시
아래 결과값을 한번 볼까요? 결과값을 보면, <hr>태그를 기점으로 컨텐츠가 나뉜것을 알 수 있습니다.
결과값
04. <pre>태그에 대해서 알아보자<pre> 태그
그 다음으로 알아볼 태그는 바로 <pre>태그인데요. <pre>태그는 컨텐츠 자체가 디자인이 되어있을 경우 사용하는 태그입니다. 위 예시를 보면 한칸씩 컨텐츠들이 띄어져 있고, 자체적으로 칸나눔이 되어있는 상태입니다. 결과값을 한번 살펴볼까요?