HTML4 - Inline,Block 의 차이 , <h1>~<h6> 태그

​

◎ Block Element

div , p , ul , ol , li , dl , dt , dd , h1 ~ h6 , pre noscript , table , hr , form , blockquote , address , fieldset

▼ 테트리스 블록처럼 촘촘이 쌓여가는게 특징이다.

▼ 블록요소 안에 블록요소를 포함할수 있다.

▼ 블록요소 안에 인라인요소를 포함할 수 있다.

▼ 일부 블록요소는 블록요소를 포함할 수 없다. - <address> , <h1>~<h6> , <p> 등

▼ 가로사이즈가 100% 이다.

▼ 가로,세로사이즈 적용 가능하다.

▼ 안쪽여백(padding), 바깥쪽여백(margin) 모든 방향이 다 적용 가능하다.

​

​

◎ Inline Element

a , span , img , input , strong , samp , var , cite , abbr q , sub , sup , select , b , strong , em , ins , u , i , textarea

▼ 한 줄로 선처럼 나열된다.

▼ 안쪽여백(padding), 바깥쪽여백 (margin) 은 좌우측만 적용된다.

▼ 가로(width), 세로(height) 사이즈 적용이 안된다.

▼ 일부 요소는 적용 가능하다 .- input , textarea , select , img

▼ 인라인 요소안에는 인라인 요소만 포함한다. 즉, 인라인 요소 안에 블럭요소를 포함할 수 없다.

▼ 자신의 부모의 가로폭보다 현재의 가로폭이 길면 다음줄로 넘어간다.

---

◎ Heading Element (Head)

<h1> , <h2> , <h3> , <h4> , <h5> , <h6>

▼ 제목(콘텐츠 블록)

▼ inline 요소와 텍스트만 포함할 수 있음

▼ 계층구조를 준수해야함 , 제목을 건너뛰는 구조는 바람직하지 않음 - h1,h2,h3,h4,h5,h6 요소 순서로 나열

▼ <h1> 요소는 한페이지에 한번만 제공함

▼ 굵은 글씨

▼ 제목과 관련된 내용의 소제목들은 h1 h2 h3 으로 쓰지만 관련없는 제목들은 상위제목가 같은 태그를 쓴다.