📌<li>요소는 왜 <ul>요소의 자식 요소여야만 하나요?
- li태그는 'list item'으로 목록을 만드는 태그이다. 그래서 목록을 나타내는 ul 태그의 자식 요소로 들어가야 한다.
📌HTML 의 inline 요소와 block 요소의 차이점을 설명해주세요. 예시도 들어주세요
- block 요소
- 모든 인라인 요소를 포함할 수 있고, 다른 블록 요소도 일부 포함할 수 있다.
- 가로 전체 넓이를 가진다. (기본값 100%)
- 줄바꿈이 일어난다.
- 크기 지정 가능
- 수직으로 쌓인다.
- 상하좌우 여백 사용 가능. (margin, padding)
- 레이아웃을 위한 용도로 사용
- block 요소 종류
- address, article, aside, audio, blockquote, canvas, dd, div, dl, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, noscript, ol, output, p, pre, section, table, ul, video
- inline 요소
- 필요한 만큼의 너비만 사용. 즉, 해당 요소 안 내용의 길이 만큼만 너비를 차지한다.
- 크기 지정 불가능. (width, height 사용X, display:inline-block 속성 줘야 가능)
- 줄바꿈이 일어나지 않는다.
- 수평으로 쌓인다.
- 상하 여백 사용 불가능. (margin, padding)
- 텍스트를 다루는 용도로 사용.
- inline 요소 종류
- a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, small, script, select, span, strong, sub, sup, textarea, tt, var
💡참고
더보기
https://developing-move.tistory.com/28
[HTML] Block 요소와 Inline 요소
▶ Block 요소 - , , 등 1. 사용 가능한 최대 가로 너비를 사용함. - 가로 너비를 지정하지 않았으나 화면의 왼쪽부터 오른쪽 끝까지 배경색이 모두 출력됨. 2. 크기를 지정할 수 있음. - 지정된 px만큼
developing-move.tistory.com
[HTML] 인라인요소와 블록요소 구분하기
HTML 태그는 크게 블록 요소(block element)와 인라인 요소(inline-element)로 나누어 진다. 이 부분을 명확히 이해하고 있어야 CSS 를 사용하는데 어려움이 없다.
jeonyoungho.github.io
