[Html] 문단을 나누는 P태그 사용법
- Web/HTML, CSS
- 2018. 6. 21.
HTML에서 문단을 나누는 태그는 P태그입니다. Paragraph, 즉 문단의 약자로, 하나의 문단을 만들 때 쓰여지는데 이 P태그를 활용하여 문단의 정렬, 배경색 등을 바꿀 수 있습니다. 많은 분들이 BR태그와 P태그를 동일한 태그라고 생각하시는 분들이 많은데 이 두가지 태그는 분명한 차이점이 있습니다. 바로 개행의 횟수죠. BR태그는 <BR><BR><BR><BR>사용한 횟수만큼 개행을 합니다. 방금 4번을 했으니 개행을 4번을 했겠군요. 하지만 P태그는 <P><P><P><P> 아무리 많이 사용하더라도 한번만 개행합니다.
문단을 나누는 P태그 사용법
태그 | 속성 | 비고 |
<P> | align="left" | 왼쪽정렬 |
align="right" | 오른쪽정렬 | |
align="center" | 가운데정렬 | |
align="justify" | 맞춤정렬 |
P태그에서 가장 많이 사용하는 속성은 바로 align(정렬)입니다. left정렬은 항상 default로 적용되어있기때문에 잘 사용하지는 않지만 가운데정렬과 오른쪽 정렬은 종종 사용하는 정렬방식입니다. 지금 제가 운영하고 있는 티스토리에서도 내부적으로 본문의 글을 가운데정렬 시키거나 오른쪽 정렬시킬때 이 P태그의 align속성을 활용해서 정렬을 시키더군요. justify속성은 맞춤정렬인데 맞춤정렬이란 한 문단이 길어져서 화면의 끝에서 자동 줄바꿈이 일어날때 그 가장자리 부분을 일정하게 맞춰주는 정렬방식입니다. 이 P태그의 정렬은 접속 디바이스의 해상도에 맞게 반응형으로 조정되기때문에 활용만 잘하면 아주 유용하게 사용이 가능합니다.
예제
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE>
<html>
<head>
<meta charset="EUC-KR">
<title>P_tag사용법</title>
</head>
<body>
<p>동해물과 백두산이 마르고 닳도록</p>
<p align = "right">하느님이 보우하사 우리나라 만세</p> <!-- 오른쪽 정렬 align -->
<p align = "center">무궁화 삼천리 화려강산</p> <!-- 가운데 정렬 align -->
<p align = "justify">대한사람 대한으로 길이 보전하세</p> <!-- 맞춤 정렬 align -->
</body>
</html>
[Html] 테이블(Table) 사용법 총정리(만들기,테두리,병합,정렬,배경색 등등)
'Web > HTML, CSS' 카테고리의 다른 글
[Html] 테이블안에 테이블 충첩하기 (2) | 2018.06.23 |
---|---|
[Html] 테이블(Table) 사용법 총정리(만들기,테두리,병합,정렬,배경색 등등) (7) | 2018.06.22 |
[Html] UL 태그, OL태그, DL태그, LI태그 사용법 (4) | 2018.06.20 |
[Html] 일정시간 후 다른페이지로 보내기 (메타태그 활용) (0) | 2018.06.19 |