인라인 요소, 블록 수준 요소, 빈 요소의 차이점에 대한 자세한 설명

인라인 요소: a, b,span,img,input,strong,select,label,em,button,textarea

블록 수준 요소: p, ul, li, dl, dt, dd, p , h1-h6, blockquote

빈 요소: br, meta, hr, link, input, img

블록 수준 요소의 특징:

1. 항상 새 줄에서 시작하여 전체 줄을 차지합니다.
2. 기본적으로 너비는 상위 요소의 너비를 자동으로 채웁니다.
3. 너비는 항상 브라우저 너비와 동일합니다.
4. 인라인 요소 및 기타 블록 요소를 수용할 수 있습니다
5. 표시 속성은 블록입니다

블록 수준 요소의 수직 인접 여백은 병합됩니다.

인라인 요소의 특징:

1. 다른 요소와 같은 줄에 있습니다.
2. 높이, 줄 높이, 여백 부분을 지정할 수 있습니다. 변경하세요
3. 너비는 콘텐츠에만 관련됩니다
4. 인라인 요소는 텍스트 또는 기타 인라인 요소만 수용할 수 있습니다
5. 표시 속성은 인라인입니다

가로 패딩-왼쪽 , padding- Right, margin-left 및 margin-right는 모두 여백 효과를 생성하지만
vertical padding-top, padding-bottom, margin-top 및 margin-bottom은 여백 효과를 생성하지 않습니다.
폭과 높이는 설정할 수 없으며 글꼴 크기에 따라 높이가 변경됩니다. 인라인 요소는 외부 테두리를 설정할 수 있지만 외부 테두리는 위쪽과 아래쪽에만 영향을 미칩니다. 오른쪽.

빈 요소의 특징:

내용이 없는 HTML 콘텐츠를 빈 요소라고 합니다. 빈 요소는 여는 태그에서 닫힙니다.

는 닫는 태그가 없는 빈 요소입니다(
태그 정의 래핑).
XHTML, XML 및 HTML의 향후 버전에서는 모든 요소를 ​​닫아야 합니다.

와 같이 여는 태그에 슬래시를 추가하는 것은 빈 요소를 닫는 올바른 방법이며 HTML, XHTML 및 XML에서 허용됩니다.

는 모든 브라우저에서 작동하지만 실제로는
를 사용하는 것이 더 오래 지속됩니다.

위 내용은 인라인 요소, 블록 수준 요소, 빈 요소의 차이점에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!