>웹 프론트엔드 >H5 튜토리얼 >HTML5의 헤더 태그 사용에 대한 간략한 분석

HTML5의 헤더 태그 사용에 대한 간략한 분석

黄舟
黄舟원래의
2017-02-23 14:23:032607검색

1aa9e5d373740b65a0cc8f0a02150c53 태그는 문서의 헤더, 일반적으로 일부 안내 및 탐색 정보를 정의합니다. 웹페이지의 헤더에만 쓰는 것이 아니고, 웹페이지의 콘텐츠에도 쓸 수 있습니다.
새 표준에서는 헤더 태그를 다음과 같이 정의합니다.

"입문 또는 탐색 보조 콘텐츠 그룹"
기본적으로는 "입문 관련 보조 콘텐츠 그룹"을 의미합니다. 문자 그대로 이해하면 헤더 태그는 페이지 헤더의 내용을 정의할 뿐만 아니라 페이지 헤더 아래에 다른 콘텐츠의 도입을 정의할 수도 있습니다. 이는 기존 페이지 헤더 정의와 완전히 일치하지 않습니다.
일반적으로 1aa9e5d373740b65a0cc8f0a02150c53 태그에는 최소한 헤더 태그(4a249f0d628e2318394fd9b75b4636b1-4e9ee319e0fa4abc21ff286eeb145ecc)가 포함되며, d8eccd9ed644b68a6460a2bb84548c82 태그도 포함될 수 있습니다. 표 콘텐츠, 로고, 검색 양식, c787b9a589a3ece771e842a6176cf8e9 탐색 등

<header>  

     <h1>雨打浮萍</h1>  

     <p>专注于web前端开发</p>  

    </header>  

    <article>  

     <header>  

      <h1>html5语义化标签之结构标签</h1>  

      <p>article、section、hgroup、aside、nav...</p>  

     </header>  

     <p>...这里面包含很多东西...</p>  

    </article>



위 구조에서 헤더를 사용하여 기사의 제목과 내용을 정의하는 것을 볼 수 있습니다. 여기서 사용된 헤더 태그는 페이지의 헤더가 아닌 기사의 헤더입니다.

따라서 HTML5에서는 헤더 사용이 더욱 유연해지고 필요에 따라 문서 구조를 정의하고 구성할 수 있습니다.

마찬가지로 페이지를 구성할 때 헤더 태그는 일반적으로 페이지 상단에 배치되지만, 왼쪽, 오른쪽, 심지어 하단에 배치하려면 태그는 중요하지 않습니다. 위치가 아닌 역할만 정의합니다. 물론, 페이지를 구성할 때 중요한 콘텐츠가 최종적으로 고급화되는 것은 검색 엔진 최적화 원칙에 더 가깝습니다.
마지막으로 HTML5의 헤더는 블록 요소이므로 대부분의 주류 브라우저에서 사용하려면 CSS를 다음과 같이 정의하는 것이 가장 좋습니다.

header { display:block;}

위 내용은 HTML5의 헤더 태그 사용법에 대한 간략한 분석입니다. 보다 자세한 관련 내용은 PHP 중국어 홈페이지(www. php.cn)!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.