블록요소는 한 개의 독립된 덩어리로 화면의 가로 폭 전체를 차지하는 요소들을 말합니다. 일반적으로 블록요소를 사용하면 라인이 바뀝니다. 블록요소는 블록요소와 인라인요소를 모두 포함할 수 있습니다. 대표적인 블록 요소는 <article>, <header>, <nav>, <section>, <div>가 있습니다.
인라인 요소는 컨텐츠 자신의 크기 만큼 영역을 가지는 요소를 말합니다. 일반적으로 인라인 요소들은 인라인 요소만 중첩이 가능합니다. 인라인 요소의 정렬은 텍스트 정렬의 영향을 받습니다. 대표적인 인라인 요소로는 span, strong 등이 존재합니다.
<span>은 대표적인 inline요소로 내용 중 일부분에 속성을 부여하고 싶을 때 주로 사용됩니다.
<p>
레이아웃을 나눌 때
<span style="color:red;">
설계가
</span>
가장 중요합니다.
</p>
블록 레벨 요소 - HTML: Hypertext Markup Language | MDN
인라인 요소 - HTML: Hypertext Markup Language | MDN
HTML - block요소 vs inline요소 ★★★★★ - (블럭요소 vs 인라인요소) 구별 차이점 비교