[CSS-layout]display속성

1. inline 요소

컨텐츠가 끝나는 지점까지의 넓이를 가지며
height와 width값을 지정할 수 없다.
margin은 상/하 적용할 수 없다.
padding으로 상/하를 넓힐 수 있으나, 다른 컨텐츠와 겹침(공간 독점하지 않음)
다른 요소와 한 줄에 위치하려는 성향을 지닌다.

다른 inline 요소를 포함할 수 있다. (block요소 포함 불가)

주요 inline 요소

<a> <span> <input> <textarea> <select>
<img> <video> <audio>
<em> <b> <strong>

2. block 요소

개별 요소가 한 줄을 완전히 차지한다. (기본 width: 100%)
height와 width값을 지정할 수 있다.

다른 inline요소와 block요소를 포함할 수 있다.

주요 block 요소

<div> <p>
<h1> ~ <h6>
<ol> <ul> <li>
<dl> <dt> <dd>

3. inline-block 요소

inline처럼 컨텐츠만큼 영역이 잡히면서,
block처럼 width와 height를 지정할 수 있다.

4. none

컨텐츠가 보이지 않는다.
visibility : hidden과 달리 영역도 차지하지 않는다.