[HTML] 문단 관련 태그 - BLOCKQUOTE 태그, HR 태그, PRE 태그

 문단과 관련된 태그들을 몇가지 정리합니다. 앞서 P태그와 BR 태그에 대해서는 설명을 드렸습니다. 앞선 포스팅을 참고하시면 될 것 같습니다.

- 포스팅 보기 : [HTML] 문단, 단락 태그 - P 태그, BR 태그

1. BLOCKQUOTE 태그

 이 태그는 인용구를 표시하는 태그입니다. Block Quotation을 의미하며 한칸을 들여쓰는 효과도 있습니다. 예전에는 브라우저에 따라 맨 앞에 수직으로 막대기형 표시가 나오거나 들여쓰기 효과만 나타나는 경우가 있었지만 요즘에는 막대기형으로 표시가 됩니다. 

 여러가지 블로그 서비스에 따라서 다양한 형태로 꾸미기를 위해 사용되기도 합니다. 테두리를 준다던지 따옴표를 표시해 준다든지 하는 식으로 말이죠. 뉴스 기사에서는 본문 요약 등의 내용을 표시하기도 하더라구요.

<blockquote>
다른 문서를 인용합니다<br />
문서를 꾸밉니다<br />
기사내용을 요약합니다
</blockquote>

다른 문서를 인용합니다 문서를 꾸밉니다 기사내용을 요약합니다

2. HR 태그

 수직으로 가로선을 그어줍니다. 제목을 쓰고 아래의 본문과 구분할 때 쓰기도 하고 본문 내의 내용을 구분짓기 위해 사용하기도 합니다.

<p align="center"> 교훈 </p>
<hr size="2" width="100px" align="center" Nosahde>
<p> 건강하고 </p>
<p> 행복하게 </p>
<p> 잘살자! </p>

교훈 건강하고 행복하게 잘살자!

 size 속성은 선의 굵기를 나타냅니다. width 속성의 선의 너비인데 픽셀단위나 % 단위로 지정할 수 있습니다. %로 하면 화면 가로크기의 몇% 이렇게 표시됩니다. align 속성은 정렬방법, Noshade를 적용하면 선의 그림지가 나타나지 않습니다.

3. PRE 태그

 웹페이지를 작성한 그대로 표현해주는 태그입니다. 특별하게 큰 의미가 있을까 싶습니다만, 그 특징을 보면 P태그를 사용한 경우 가로크기가 화면을 벗어나면 줄바꿈을 하게 되는데 반해 PRE 태그는 그대로 표시하면서 가로 스크롤바가 생기게 됩니다.

<pre>
화면에 입력한대로 표시합니다
줄바꿈이나 띄어쓰기 등
작성한 내용을 그대로 표현합니다
 
이렇게 빈 공백이            그대로입니다
</pre>

화면에 입력한대로 표시합니다 줄바꿈이나 띄어쓰기 등 작성한 내용을 그대로 표현합니다 이렇게 빈 공백이 그대로입니다