Nav element
The HTML nav element represents a section of a document containing navigation links or other navigation-related content.
Web Design Playground, Second Edition
The HTML nav element represents a section of a document containing navigation links or other navigation controls.
- How it is used
- Defines page areas containing navigation links or controls such as a search box.
- How deep it goes
- Demonstrates nav placement, link markup, list-based menus, and CSS styling without detailing browser internals.
- Examples
- Uses a four-link site menu, a photo-gallery menu with a current-page marker, and a portfolio navigation list.
- What you can do after
- Build it from scratch by wrapping site or page links in nav and styling the resulting navigation area.
Read how Web Design Playground, Second Edition explains nav element →
Build a Website with ChatGPT
An HTML element that identifies a section of a document containing navigation links.
- How it is used
- Organizes links to other site pages as a reusable area in information, interest, and article page layouts.
- How deep it goes
- Defines nav, demonstrates five links, and explains Flexbox styling, while deferring detailed Flexbox and menu implementation.
- Examples
- Demonstrates a five-link bar for Home, Blog, FAQ, About, and Contact, plus navigation controls in a course catalog.
- What you can do after
- Build it from scratch with nav and anchor tags, then style its links as a horizontal Flexbox bar.
Read how Build a Website with ChatGPT explains nav element →
Related concepts
- navigationimplements · Navigation is the process and structure that enables movement among pages, sections, views, or other destinations in a digital system.
- flexboxused by · Flexbox is a CSS one-dimensional layout model for arranging, sizing, aligning, and distributing items along a row or column.
- header elementpart of · The HTML header element represents introductory content or navigational aids for a document or section.
- hypertext linkuses · A hypertext link is a reference embedded in digital content that enables navigation to another resource or location.
- semantic markupkind of · Semantic markup is the practice of using HTML elements according to the meaning and structural or interactive role of their content.
- maincontrasts with · The HTML main element identifies the dominant content of a document or application view, excluding shared navigation and peripheral content.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.