CSS속성 display의 값 inline, inline-block, block의 차이점에 대해서 알아보겠습니다.
inline
인라인이라는 말 그대로 요소와 요소끼리 같은 라인에 배치가 가능한 것을 의미합니다. 대표적인 예로 <span>, <a>, <img>가 있습니다.
block
block이란 이 요소 바로옆에 다른 요소를 붙일수 없는 것을 의미합니다. row 행 하나 전체를 사용하는 경우입니다. 대표적인 예로 <header>, <footer>, <p>, <li>, <table>, <div>, <h1> 가 있습니다.
inline-block
inline-block은 inline의 특징과 block의 특징을 모두가지고 있는 속성입니다. inline 속성을 기본으로 하지만 width/height를 적용 하여 커스텀하게 사용할 수 있습니다.
--결론--
HTML태그에 정해진 inline 태그와 block 태그가 있지만 CSS속성을 통해 inline 태그가 block 태그가 될수있고 반대도 성립한다.
oh yeah