상세 컨텐츠

본문 제목

[HTML 기초] HTML <p> 태그, <hn> 태그

HTML & WEB

by 어뮤징 라이프 2017. 3. 7. 09:11

본문

반응형
HTML을 작성하다 보면 자주 쓰는 기초 태그가 있는데요, 오늘은 HTML 기초 명령어 <P> 태그, <Hn> 태그에 대해서 알아보겠습니다.




<hn> 태그


<hn> 제목 </hn> : 제목을 표시하는 태그이며, 이 태그를 이용하면 일반 텍스트보다 크고 진하게 표시할 수 있습니다. 크기에 따라 <h1>~<h6> 까지 사용할 수 있는데, h1이 가장 크고 h6이 가장 작게 표시됩니다. 예시로 작성해보도록 하겠습니다.

<html>
<head>
<title> 어뮤징 라이프 </title>
</head>
<body>

 <h1> Amusing Life </h1>
 <h2> Amusing Life </h2>
 <h3> Amusing Life </h3>
 <h4> Amusing Life </h4>
 <h5> Amusing Life </h5>
 <h6> Amusing Life </h6>

</body>
</html>


그럼, 위와 같은 크기의 제목으로 나타납니다.





<p> 태그


<p> 글 </p> : 웹 문서에서 가장 많이 사용되는 태그 중 하나이며, 텍스트 단락을 만들어 냅니다. 즉 줄 바꿈. 태그라고 부릅니다. 예시로 작성하겠습니다.

<html>
<head>
<title> P 태그 표시하기 </title>
</head>
<body>
 <h2> Amusing Life </h2>

<P>안녕하세요.</P>
<P>오늘은 HTML 자주 쓰는 기본 태그에 대하여 알아보는 시간입니다.
위에서 제목을 나타내는 Hn 태그를 배웠고요, 지금은 단락을 표시하는 P 태그를 알아보고 있습니다.</P>
<P>그럼, 화면으로 보실까요?</P>

</body>
</html>


위와 같은 화면으로 나타나는데요, <P> 태그가 입력되지 않은 부분은 화면 너비에 따라서 자동으로 줄 바꿈으로 넘어갑니다.
따라서, <P> 태그를 입력한 부분은 단락이 바뀌는 것을 보실 수 있습니다. (단순히 줄 바꿈을 하고자 한다면 <BR> 태그를 입력하시면 됩니다.)


HTML 기초 태그, 재목 태그와 줄 바꿈 태그를 알아보았습니다. 도움이 되셨길 바래요 ^ ^


반응형

관련글 더보기