Block 요소와 Inline 요소

블록 요소

- div, h1, p 등

- 사용 가능한 최대 가로 너비를 시작한다.

- 크기를 지정할 수 있다.

- width 100%; height: 0;로 시작한다고 생각하면 된다.

- 수직으로 쌓인다.

- margin, padding 위, 아래, 좌, 우 사용 가능

- 레이아웃을 잡는 용도

 

인라인 요소

- span, img 등

- 필요한 만큼의 너비를 사용한다.

- 크기를 지정할 수 없다.

- width 0; height: 0; 로 시작한다고 생각하면 된다.

- 수평으로 쌓인다.

- margin, padding 위, 아래는 사용할 수 없다. (padding의 아래는 시각적으로 표현이 되지만 실제로는 다른 요소와의 거리를 부여하지 못한다.)

- 텍스트를 작업하는 용도

 

 

블록 요소, 인라인 요소는 css의 display 속성으로 변경 가능하다.