[HTML] 블록 요소와 인라인 요소

HTML·CSS

최성2 2022. 2. 7. 23:41

블록 요소

- 전체 넓이 만큼 차지한다

- vertical-align/ text-align 적용 불가

<h1>hello</h1>

- 요소 목록

블록 레벨 요소 - HTML: Hypertext Markup Language | MDN

HTML(Hypertext Markup Language)의 요소는 역사적으로 "블록 레벨" 요소와 "인라인" 요소로 분류됐습니다. 기본적으로 블록 레벨 요소는 부모 요소의 전체 공간을 차지하여 "블록"을 만듭니다. 이 글에서

developer.mozilla.org

인라인 요소

- 컨텐츠의 넓이 만큼 차지

- height/ width 적용 불가

<img src="" alt="">

- 요소 목록

인라인 요소 - HTML: Hypertext Markup Language | MDN

HTML(Hypertext Markup Language)의 요소는 역사적으로 "블록 레벨" 요소와 "인라인" 요소로 분류됐습니다. 인라인 요소는 콘텐츠의 흐름을 끊지 않고, 요소를 구성하는 태그에 할당된 공간만 차지합니다

developer.mozilla.org

- 대부분의 요소는 같은 형태의 다른 요소 안에 포함할 수 있다

- 대부분의 블록 요소는 다른 인라인 요소를 포함할 수 있다

- 인라인 요소는 블록 요소를 포함할 수 없다 👇

<span>
	<p>hello</p>
</span>

성2