[HTML] 문단 관련 요소

#01. 단락 나누기

1) 제목

<h1>H1 수준의 제목</h1>
<h2>H2 수준의 제목</h2>
<h3>H3 수준의 제목</h3>
<h4>H4 수준의 제목</h4>
<h5>H5 수준의 제목</h5>
<h6>H6 수준의 제목</h6>

• h1~h6: 제목을 표시하기 위한 태그로서, 6단계의 수준을 갖는다.
• “h”는 Heading의 줄임말.

2) 본문

문단 나누기

<p>내용</p>

1. 본문안에 다른 본문 중첩 사용 가능
   
   • <p> <p> ... </p> </p>
2. 두 개 이상의 본문을 연속적으로 사용 가능. 각 문단간에는 여백이 형성된다.
   
   • <p> ... </p> <p> ... </p>

인용문

<blockquote> ... </blockquote>

• 출처가 존재하는 형식의 문장 구성
• 이 태그 안에는 다른 문단 요소들이 포함될 수 있다.
• 인용문으로 설정된 문단은 오른쪽으로 들여쓰기가 적용된다.

목록

모든 형태의 웹 사이트 메뉴 구성에 사용되는 태그

1. 목록의 영역 정의
   • 순서없는 목록(unordered list) : <ul>~</ul>
   • 순서있는 목록(ordered list) : <ol>~</ol>
2. 목록의 영역 안에 항목(list item)을 나열하기
   • <li> 내용 </li>
3. 항목 안에서는 독립적인 본문을 구성할 수 있다.
   • p, div, h(n) 태그 사용 가능함
4. 항목 안에서는 새로운 목록을 하위 요소로 포함할 수 있다.
   <li>태그 안에서 새롭게 <ul>이나 <ol>태그를 시작할 수 있다는 의미.

    <ul | ol>
        <li>
          <ul | ol> ... </ul | ol>
        </li>
    </ul | ol>
   

#02. 페이지 영역 나누기 –> div

1. 개념적으로만 나눈다.
   • HTML에서는 디자인이 적용되지 않음
2. 연속적으로 사용할 경우 간격 없는 문단을 구성.
3. 중첩해서 사용할 수 있으며 모든 종류의 HTML 태그 포함 가능
4. 용도에 따라 시멘틱 요소로 세분화 할 수 있다.
   • header, section, article, nav, aside, hgroup 등…
5. 대부분의 웹 사이트가 시멘틱 요소를 디테일하게 사용하지는 않는다.
   (div로 대동단결!!!)

모든 태그 요소에 사용할 수 있는 id속성

각 태그에게 고유한 기능을 부여하기 위해 다른 요소와 중첩되지 않는 값을 부여해야 한다.

id속성을 통해 고유한 기능을 부여하기 위해 이 속성이 CSS나 Javascript와 연계된다.

반드시 그 파일 안에서 고유한 값을 명시해야 한다.

#03. 기타

• 화면상에 직선 긋기 : <hr />
• copyright 특수문자 : ©
• HTML 코드에서는 띄어쓰기나 줄바꿈을 아무리 많이 사용하더라도
  브라우저상에서는 띄어쓰기 한 칸으로 표시된다.
  • 줄바꿈 : <br />
  • 띄어쓰기 특수문자 :