Home Tutorials HTML Tutorial Layout Elements
Layout Elements

Layout Elements


24. Layout Elements

HTML layout commonly uses semantic elements such as <header>, <nav>, <section>, <article>, <aside>, and <footer>. These elements define the major regions of a page.

Syntax

<header></header>
<nav></nav>
<section></section>
<footer></footer>

Example

<header>
    <h1>News Site</h1>
</header>
<nav>
    <a href="#">Home</a> | <a href="#">About</a>
</nav>
<section>
    <p>Latest updates here.</p>
</section>
<footer>
    <p>Footer text</p>
</footer>

Output

A page layout is displayed with top heading, navigation links, content section, and footer.
Example

🏋️ Test Yourself With Exercises

Take our quiz on Layout Elements to test your knowledge.

Browse Quizzes »