[HTML/CSS] 1-2. Block vs Inline

2. Block vs Inline

 

Block

• 기본적으로 블록 레벨 요소는 부모 요소의 전체 공간을 차지하여 '블록'을 만듭니다.
• 브라우저는 보통 블록 레벨 요소와 앞과 뒤를 개행해서 그립니다. 상자를 쌓는 것처럼 생각할 수 있습니다.
• 블록 레벨 요소는 언제나 새로운 줄에서 시작하고, 좌우 양쪽으로 최대한 늘어나 가능한 모든 너비를 차지합니다.
• ex. <div>,  <h1>, <p>

 

Inline

• 인라인 요소는 콘텐츠의 흐름을 끊지 않고, 요소를 구성하는 태그에 할당된 공간만 차지합니다.
• ex. <a>, <img>, <span>, <strong>

 

 

 

---