display 속성은 CSS가 화면에 보여지는 속성입니다.
block
박스의 개념이다. 고로 margin과 padding을 설정할 수 있지만 inline 엘레멘트는 그것이 불가능하다.
display 속성을 block으로 설정하면 inline의 속성을 가진 개체도 블럭엘레멘트로 표현된다.
예) span태그에 display 속성을 block을 주면 div태그처럼 사용가능하다.
none
display 속성을 none으로 하면 개체가 화면에 보이지 않는다.
inline
보통 디폴트값이며 박스 개념이 아닌 글자 개념이라 margin과 padding값을 줄 수가 없다. 줄의 흐름에 따라 흘러간다.
block의 속성을 가진 태그에 display 속성을 inline으로 주면 block의 속성이 사라진다.
예) div태그에 display 속성을 inline을 주면 span태그처럼 사용가능하다.
inline-block
개체가 인라인으로 표현되지만, 개체의 내용은 블럭 엘레멘트로 표현된다. 죽 인접 인라인 엘레멘트는 margin과 padding을 허용하지만 같은 라인에 표현된다.