Footer section
A footer is a region associated with a document or section that contains closing or supplementary content, often positioned at the bottom.
Build a Website with ChatGPT
The footer element is an HTML element representing closing or supplemental content for a page or section.
- How it is used
- Adds closing or supplemental content to web pages, usually copyright notices and social media links.
- How deep it goes
- Defines placement, common contents, HTML markup, and basic styling without detailing advanced footer behavior.
- Examples
- Uses book club, online journal, information site, article, gallery, and portfolio pages with copyright-focused footers.
- What you can do after
- Apply it via ChatGPT prompts and HTML markup to add and customize a page footer.
Read how Build a Website with ChatGPT explains footer section →
Web Design Playground, Second Edition
The HTML footer element represents a footer for a page or section, typically containing closing or supplementary information.
- How it is used
- Defines the closing area of a semantic HTML page for copyright, contact information, and supplementary links.
- How deep it goes
- Explains the footer’s semantic role and demonstrates styling it with Flexbox, including keeping it below short main content.
- Examples
- Uses a Semantic Depot layout, a photo-gallery copyright-and-social footer, and a portfolio footer with site links.
- What you can do after
- Build a semantic footer containing closing information and style its contents with Flexbox in a page layout.
Read how Web Design Playground, Second Edition explains footer section →
Web Design Playground
A concluding section at the bottom of a document or page that typically contains supplemental information.
- How it is used
- Closes personal, landing, gallery, portfolio, and general HTML5 pages with supplemental information and navigation.
- How deep it goes
- Defines semantic purpose, demonstrates common contents, and explains flexbox, spacing, bottom placement, and fixed positioning.
- Examples
- Uses copyright notices, contact details, social media links, site navigation links, slogans, and fixed gallery footers.
- What you can do after
- Apply it via HTML and CSS to build, style, align, bottom-position, or fix a page footer.
Related concepts
- HTMLpart of · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- flex containeruses · A flex container is an element whose children are laid out as flex items according to the CSS Flexible Box Layout model.
- blogpart of · A blog is a regularly updated website or online publication containing dated or organized posts, articles, or multimedia entries.
- holy-grail layoutpart of · The Holy Grail layout is a web page pattern with central content flanked by sidebars, typically accompanied by a header and footer.
- websitepart of · A website is a collection of related web pages and resources made accessible through the web under a common site identity or address.
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.