이번 글에서는 HTML을 통한 웹페이지 구성시에 단락을 구분해주는 p 태그의 사용 방법에 대하여 다루도록 하겠습니다.
# 단락이 나뉘어져 있는 글
먼저, 아래 사진을 보시면 우리가 속한 우주가 가상현실일 것이라고 주장하는 과학자들의 논리의 축약본과 제가 우리의 우주가 가상현실이 아닐것이라 생각하는 이유에 대하여 적어둔 글이 있습니다.
이 글을 보시면 우주가 가상현실인지에 대한 제목 아래로 여러 단락들이 이어져 있습니다.
# p 태그 사용방법
먼저, 위 글을 그대로 html로 옮겨 보겠습니다. 본문에 해당하는 내용은 html 내에서 body 태그 내부에 들어가야 하기 때문에 위 글의 전문을 body 태그로 복사해서 붙여 넣겠습니다.
위 사진을 보시면 body 태그 안에 글들이 들어가 있는 것을 보실수 있으며 그대로 복사, 붙여넣기 과정을 실행 한 것이기 때문에 한글 파일에서 문서의 단락이 나눠져 있었듯이 html 편집기 내부에서도 단락과 줄이 나뉘어져 있는 것을 알 수 있습니다.
이 html이 그대로 구현된 웹페이지 사진은 아래와 같습니다. 보이듯이, 단락과 줄바꿈에 대한 적용이 일체 되어 있지 않습니다.
이는, 우리가 컴퓨터와 약속한 규칙을 따르지 않았기 때문입니다. 이 html 내에서 단락을 구분하는 태그가 바로 p태그이며, <p> 단락 내용 </p>와 같이 사용하며 사용시 단락 내용의 위 아래로 1칸 분량의 여백을 부여합니다. 이 여백의 크기는 각 웹페이지의 CSS 설정상에서 결정되며, 무조건 1칸입니다.
그러면, HTML 편집기 상에서 p 태그를 활용하여 단락의 구분을 지어보겠습니다.
보이시는것과 같이 p 태그 사용으로 단락이 구분되었습니다. 이것이 p 태그의 사용방법이며 글에 있는 제목과 소제목을 구분하기 위해서는 h 태그를, 줄바꿈을 조금더 주고 싶다면 p 태그를 한번더 사용하거나 br 태그를 이용하는 방법등이 있습니다.
여기까지 HTML을 통한 웹페이지 구성시에 단락을 구분해주는 p 태그의 사용 방법에 대하여 다루었습니다.
댓글