개념

블록 요소
한 줄 전체를 차지하며 앞뒤로 줄바꿈이 발생하는 요소 유형

인라인 요소
줄바꿈 없이 한 줄 안에서 필요한 너비만 차지하는 요소 유형

특징

• CSS의 display 속성으로 변경할 수 있다.
• 블록은 width/height/margin/padding을 적용할 수 있다.
• 인라인은 width/height/margin/padding이 무시된다.
• 인라인 블록은 한 줄에 배치되지만, width/height/margin/padding을 적용할 수 있다.
• 인라인 요소는 블록 요소를 포함할 수 없는게 일반적이다.

실무

• 문서 뼈대는 블록 요소로 구성하고, 문장 내 강조/링크 등은 인라인 요소로 표현한다.
• 과거에는 인라인 블록으로 가로 배치를 했지만, 현재는 flex/grid를 우선 고려한다.