Thẻ HTML <header>

Định nghĩa và cách sử dụng thẻ <header>

Phần tử <header> đại diện cho một container chứa nội dung giới thiệu hoặc một tập hợp các liên kết điều hướng. Ví dụ, đây là header cho một <article>:

<article>
  <header>
    <h1>Tiêu đề ở đây</h1>
    <p>Đăng bởi John Doe</p>
    <p>Một vài thông tin bổ sung</p>
  </header>
  <p>Nguồn gốc</p>
</article>

Phần tử <header> thường chứa:

• Một hoặc nhiều phần tử tiêu đề (<h1> - <h6>)
• Logo hoặc biểu tượng
• Thông tin về quyền tác giả

Lưu ý: Bạn có thể có nhiều phần tử <header> trong một tài liệu HTML. Tuy nhiên, <header> không thể được đặt trong một phần tử <footer>, <address> hoặc một phần tử <header> khác.

Hỗ trợ trình duyệt

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử.

Thuộc tính Global

Thẻ <header> cũng hỗ trợ các thuộc tính Global trong HTML.

Thuộc tính sự kiện

Thẻ <header> cũng hỗ trợ các thuộc tính sự kiện trong HTML.

Các ví dụ khác

Ví dụ về tiêu đề trang:

<header>
  <h1>Tiêu đề trang chính ở đây</h1>
  <p>Đăng bởi John Doe</p>
</header>

Cài đặt CSS mặc định

Hầu hết các trình duyệt sẽ hiển thị phần tử <header> với các giá trị mặc định sau:

header {
  display: block;
}