A heading here
Posted by John Doe
Some additional information here
Lorem ipsum dolor sit amet...
<header>
The HTML <header> element serves as a container for introductory content or navigation links, usually located at the top of a section or page to establish context and structure.
<header> Tag
The <header> element is used to define introductory content, commonly containing headings, navigation links, logos, search forms, or author details.
Syntax
index.html
<header>
<!-- Header content goes here -->
</header>
<header> Demo
index.html
<article>
<header>
<h1>A heading here</h1>
<p>Posted by John Doe</p>
<p>Some additional information here</p>
</header>
<p>Lorem ipsum dolor sit amet...</p>
</article>
Definition and Usage
The <header> element is utilized to group introductory content or navigation links.
It typically contains:
Multiple
<header> elements can exist within a single HTML document. However, a <header> cannot be nested inside a <footer>, <address>, or another <header> element.Accessibility
When placed within the <body>, the <header> element creates a banner landmark. However, it does not function as a banner landmark when inside an <article>, <aside>, <main>, <nav>, or <section> element.
Default CSS Settings
Web browsers apply default styles to the <header> element.
style.css
header {
display: block;
}
Conclusion
The <header> tag in HTML is used to define the introductory content or navigation section of a webpage or document. It typically contains headings, logos, or author details, improving both structure and accessibility. While multiple <header> elements can appear, they cannot be nested inside other structural elements like <footer>, <address> or <article>. Custom styling can be applied to enhance its visual appeal and functionality, making it an essential tool for organizing webpage content effectively.
<div>
The HTML <div> element serves as a versatile container for grouping and styling content sections, enabling flexible layout and CSS-based styling.
<footer>
The HTML <footer> element marks the footer of a document or section, often including metadata, contact details, or copyright information, thereby improving content organization and semantics.