[CSS] display - inline,block,inline-block

display : block 

한줄에 나열하지 않으며 해당 태그 자체를 한줄로 표현합니다.

(기본적으로 width 100%)

margin,width,height 속성 정의 가능합니다.

display : inline

줄을 바꾸지 않고 다른 요소와 함께 한 행에 위치하려는 성향 ex: a태그

(width 와 height 속성이 적용되지 않음 margin-top,margin-bottom 속성 적용 X)

최소한의 간격 유지를 위해서 기본 내부 margin 5px 발생 (웹브라우저에 의해)

inline 태그는 높이와 너비가 품고있는 내부 요소의 부피에 맞게 맞춰 집니다.

display : inline-block

margin,width,height 몸두 제어 가능 

(좌우 5px의 기본 여백 )

inline-block의 너비와 높이는 품고있는 내부 요소에 맞춰지며 width,height를 적용가능 합니다.