Section

The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.

Nav

The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links.

Not all groups of links on a page need to be in a nav element — only sections that consist of major navigation blocks are appropriate for the nav element. In particular, it is common for footers to have a short list of links to various pages of a site, such as the terms of service, the home page, and a copyright page. The footer element alone is sufficient for such cases, without a nav element.

A nav element doesn't have to contain a list, it can contain other kinds of content as well. In this navigation block, links are provided in prose:

Article

The article element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

Aside

The aside element represents a section of a page that consists of content that is tangentially related to the content around the aside element, and which could be considered separate from that content. Such sections are often represented as sidebars in printed typography.

The h1, h2, h3, h4, h5, and h6 elements

These elements represent headings for their sections.

The semantics and meaning of these elements are defined in the section on headings and sections.

These two snippets are equivalent in the outline:

hgroup

The hgroup element represents the heading of a section. The element is used to group a set of h1u{2013} h6 elements when the heading has multiple levels, such as subheadings, alternative titles, or taglines.

Header

The header element represents a group of introductory or navigational aids.

A header element is intended to usually contain the section's heading (an h1– h6 element or an hgroup element), but this is not required. The header element can also be used to wrap a section's table of contents, a search form, or any relevant logos.

Footer

The footer element represents a footer for its nearest ancestor sectioning content or sectioning root element. A footer typically contains information about its section such as who wrote it, links to related documents, copyright data, and the like.

Here is an example which shows the footer element being used both for a site-wide footer and for a section footer.

Address

The address element represents the contact information for its nearest article or body element ancestor. If that is the body element, then the contact information applies to the document as a whole.

p

The p element represents a paragraph.

hr

The hr element represents a paragraph-level thematic break, e.g. a scene change in a story, or a transition to another topic within a section of a reference book.

pre

The pre element represents a block of preformatted text, in which structure is represented by typographic conventions rather than by elements.

function Panel(element, canClose, closeHandler) {
              this.element = element;
              this.canClose = canClose;
              this.closeHandler = function () { if (closeHandler) closeHandler() };
            }    .markup

      You are in an open field west of a big white house with a boarded
      front door.
      There is a small mailbox here.
      >
    
    open mailbox
    
      Opening the mailbox reveals:
      A leaflet.
      >
    

  ()                   o             | |   /|   / o
  /\         ,_                 __,  | |    |__/    _|_
 /  \|   |  /  |  |  |_|  |  |_/  |  |/     | \   |  |
/(__/ \_/|_/   |_/ \/  |_/ \/  \_/|_/|__/   |  \_/|_/|_/

blockquote

The blockquote element represents a section that is quoted from another source.

ol

The ol element represents a list of items, where the items have been intentionally ordered, such that changing the order would change the meaning of the document.

ul

The ul element represents a list of items, where the order of the items is not important — that is, where changing the order would not materially change the meaning of the document.

li

The li element represents a list item. If its parent element is an ol, ul, or menu element, then the element is an item of the parent element's list, as defined for those elements. Otherwise, the list item has no defined list-related relationship to any other li element.

The dl element represents an association list consisting of zero or more name-value groups (a description list). Each group must consist of one or more names ( dt elements) followed by one or more values ( dd elements). Within a single dl element, there should not be more than one dt element for each name.

The dt element represents the term, or name, part of a term-description group in a description list ( dl element).

The dd element represents the description, definition, or value, part of a term-description group in a description list ( dl element).

The figure element represents some flow content, optionally with a caption, that is self-contained and is typically referenced as a single unit from the main flow of the document.

The element can thus be used to annotate illustrations, diagrams, photos, code listings, etc, that are referred to from the main content of the document, but that could, without affecting the flow of the document, be moved away from that primary content, e.g. to the side of the page, to dedicated pages, or to an appendix.

The figcaption element child of the element, if any, represents the caption of the figure element's contents. If there is no child figcaption element, then there is no caption.

interface PrimaryCore {
             boolean verifyDataLine();
             void sendData(in sequence data);
             void initSelfDestruct();
            }      %p The API is designed to use UTF-8.

a

The a element may be wrapped around entire paragraphs, lists, tables, and so forth, even entire sections, so long as there is no interactive content within (e.g. buttons or other links). This example shows how this can be used to make an entire advertising block into a link:

em

The em element represents stress emphasis of its contents.

strong

The strong element represents strong importance for its contents.

small

The small element represents side comments such as small print.

s

The s element represents contents that are no longer accurate or no longer relevant.

cite

The cite element represents the title of a work (e.g. a book, a paper, an essay, a poem, a score, a song, a script, a film, a TV show, a game, a sculpture, a painting, a theatre production, a play, an opera, a musical, an exhibition, a legal case report, etc). This can be a work that is being quoted or referenced in detail (i.e. a citation), or it can just be a work that is mentioned in passing.

q

The q element represents some phrasing content quoted from another source.

dfn

The dfn element represents the defining instance of a term. The paragraph, description list group, or section that is the nearest ancestor of the dfn element must also contain the definition(s) for the term given by the dfn element.

abbr

The abbr element represents an abbreviation or acronym, optionally with its expansion. The title attribute may be used to provide an expansion of the abbreviation. The attribute, if specified, must contain an expansion of the abbreviation, and nothing else.

time

The time element represents either a time on a 24 hour clock, or a precise date in the proleptic Gregorian calendar, optionally with a time and a time-zone offset. [GREGORIAN]

code

The code element represents a fragment of computer code. This could be an XML element name, a filename, a computer program, or any other string that a computer would recognize.

var i: Integer;
begin
   i := 1;
end.  %div#var.element

var

The var element represents a variable. This could be an actual variable in a mathematical expression or programming context, or it could just be a term used as a placeholder in prose.

samp

The samp element represents (sample) output from a program or computing system.

      jdoe@mowmow:~$
      ssh demo.example.com
      Last login: Tue Apr 12 09:10:17 2005 from mowmow.example.com on pts/1
      Linux demo 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189 #1 SMP Tue Feb 1 11:22:36 PST 2005 i686 unknown
      jdoe@demo:~$
      _
    

kbd

The kbd element represents user input (typically keyboard input, although it may also be used to represent other input, such as voice commands).

sub and sup

The sup element represents a superscript and the sub element represents a subscript.

i

The i element represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, a thought, a ship name, or some other prose whose typical typographic presentation is italicized.

b

The b element represents a span of text to be stylistically offset from the normal prose without conveying any extra importance, such as key words in a document abstract, product names in a review, or other spans of text whose typical typographic presentation is boldened.

mark

The mark element represents a run of text in one document marked or highlighted for reference purposes, due to its relevance in another context. When used in a quotation or other block of text referred to from the prose, it indicates a highlight that was not originally present but which has been added to bring the reader's attention to a part of the text that might not have been considered important by the original author when the block was originally written, but which is now under previously unexpected scrutiny. When used in the main prose of a document, it indicates a part of the document that has been highlighted due to its likely relevance to the user's current activity.

The ruby element allows one or more spans of phrasing content to be marked with ruby annotations. Ruby annotations are short runs of text presented alongside base text, primarily used in East Asian typography as a guide for pronunciation or to include other annotations. In Japanese, this form of typography is also known as furigana.

The rt element marks the ruby text component of a ruby annotation.

The rp element can be used to provide parentheses around a ruby text component of a ruby annotation, to be shown by user agents that don't support ruby annotations.

bdi

The bdi element represents a span of text that is to be isolated from its surroundings for the purposes of bidirectional text formatting. [BIDI]

Usage summary

Visit my
            drinks
            page.

I must say I
            adore
            lemonade.

This tea is
            very hot.

These grapes are made into wine.
            Alcohol is addictive.

Price:
            £4.50
            £2.00!

The case
            Hugo v. Danielle
            is relevant here.

The judge said
            You can drink water from the fish tank
            but advised against it.

The term
            organic food
            refers to food produced without synthetic chemicals.

Organic food in Ireland is certified by the
            IOFGA.

Published
            2009-10-21.

The
            fruitdb
            program can be used for tracking fruit production.

If there are
            n
            fruit in the bowl, at least
            nu{f7}2
            will be ripe.

The computer said
            Unknown error -3.

Hit
            F1
            to continue.

Water is H2O.

The Hydrogen in heavy water is usually
            2H.

Lemonade consists primarily of
            Citrus limon.

Take a
            lemon
            and squeeze it with a
            juicer.

Elderflower cordial, with one
            part
            cordial to ten
            parts
            water, stands a
            part
            from the rest.

 OJ (Orange Juice)

The recommended restaurant is
            My Juice Café (At The Beach).

The proposal is to write English, but in reverse order. "Juice" would become "Juice"

In French we call it
            sirop de sureau.

Simply Orange Juice Company
Apopka, FL 32703
U.S.A.

www.simplyorangejuice.com

Table

The table element represents data with more than one dimension, in the form of a table.

thead

The thead element represents the block of rows that consist of the column labels (headers) for the parent table element, if the thead element has a parent and it is a table.

School auction sign-up sheet

Name	Product	Picture	Price
Your name here	What are you selling?	Link to a picture	Your reserve price
Ms Danus	Doughnuts		$45

Sample Tables

Sample Forms

fieldset

label

details

The details element represents a disclosure widget from which the user can obtain additional information or controls.

menu

The menu element represents a list of commands.