Content sectioning elements allow you to organize the document content into logical pieces. Use the sectioning elements to create a broad outline for your page content, including header and footer navigation, and heading elements to identify sections of content.
Element | Description |
---|---|
<address> |
supplies contact information |
<article> |
represents a self-contained composition in a document |
<footer> |
represents a footer for its nearest sectioning content or sectioning root element. A footer typically contains information about the author of the section, copyright data or links to related documents. |
<header> |
represents a group of introductory or navigational aids |
<h1>, <h2>, <h3>, <h4>, <h5>, <h6> |
Heading elements implement six levels of document headings |
<hgroup> |
represents the heading of a section |
<nav> |
represents a section of a page that links to other pages |
<section> |
represents a generic section of a document |
Use HTML text content elements to organize blocks or sections of content placed between the opening <body>
and closing </body>
tags. Important for accessibility and SEO, these elements identify the purpose or structure of that content.
Element | Description |
---|---|
<dd> |
the description of a term in a description list (
|
<div> |
is the generic container for flow content, which does not inherently represent anything. |
<dl> |
encloses a list of pairs of terms and descriptions |
<dt> |
identifies a term in a definition list |
<figcaption> |
represents a caption or a legend associated with a figure or an illustration |
<figure> |
represents self-contained content, frequently with a caption |
<hr> |
represents a thematic break between paragraph-level elements |
<li> |
is used to represent an item in a list |
<main> |
represents the main content of the of a document or application |
<ol> |
represents an ordered list of items |
<p> |
represents a paragraph of text |
<pre> |
represents preformatted text |
<ul> |
represents an unordered list of items |
Use the HTML inline text semantic to define the meaning, structure, or style of a word, line, or any arbitrary piece of text.
Element | Description |
---|---|
<abbr> |
represents an abbreviation and optionally provides a full description for it |
<b> |
represents a span of text stylistically different from normal text, without conveying any special importance or relevance |
<bdi> |
isolates a span of text that might be formatted in a different direction from other text outside it |
<bdo> |
is used to override the current directionality of text |
<br> |
produces a line break in text (carriage-return) |
<cite> |
represents a reference to a creative work. It must include the title of a work or a URL reference, which may be in an abbreviated form according to the conventions used for the addition of citation metadata. |
<code> |
represents a fragment of computer code |
<data> |
links a given content with a machine-readable translation. If the content is time- or date-related, the must be used |
<dfn> |
represents the defining instance of a term |
<em> |
marks text that has stress emphasis |
<i> |
represents a range of text that is set off from the normal text for some reason |
<kbd> |
represents user input and produces an inline element displayed in the browser's default monospace font |
<mark> |
represents highlighted text |
<q> |
indicates that the enclosed text is a short inline quotation |
<rp> |
is used to provide fall-back parenthesis for browsers non-supporting ruby annotations |
<rt> |
embraces pronunciation of characters presented in a ruby annotations |
<rtc> |
embraces semantic annotations of characters presented in a ruby of elements used inside of element |
<ruby> |
represents a ruby annotation |
<s> |
renders text with a strikethrough |
<samp> |
is an element intended to identify sample output from a computer program |
<small> |
makes the text font size one size smaller |
<span> |
is a generic inline container for phrasing content, which does not inherently represent anything |
<strong> |
gives text strong importance, and is typically displayed in bold |
<sub> |
defines a span of text that should be displayed, for typographic reasons, lower, and often smaller, than the main span of text |
<sup> |
defines a span of text that should be displayed, for typographic reasons, higher, and often smaller, than the main span of text |
<time> |
represents either a time on a 24-hour clock or a precise date in the Gregorian calendar (with optional time and timezone information) |
<u> |
renders text with an underline, a line under the baseline of its content |
<var> |
represents a variable in a mathematical expression or a programming context |
<wbr> |
represents a position within text where the browser may optionally break a line, though its line-breaking rules would not otherwise create a break at that location |
HTML supports various multimedia ressources such as images, audio, and video.
Element | Description |
---|---|
<area> |
defines a hot-spot region on an image, and optionally associates it with a hypertext link |
<audio> |
is used to embed sound content in documents |
<map> |
is used with elements to define an image map (a clickable link area) |
<track> |
is used as a child of the media elements— and |
<video> |
embeds video content in a document |
In addition to regular multimedia content, HTML can include a variety of other content, even if it's not always easy to interact with.
Element | Description |
---|---|
<embed> |
represents an integration point for an external application or interactive content (in other words, a plug-in) |
<object> |
represents an external resource, which can be treated as an image, a nested browsing context, or a resource to be handled by a plugin |
<param> |
defines parameters for |
<source> |
is used to specify multiple media resources for |
In order to create dynamic content and Web applications, HTML supports the use of scripting languages, most prominently JavaScript. Certain elements support this capability.
Element | Description |
---|---|
<canvas> |
used to draw graphics via scripting (usually JavaScript) |
<noscript> |
defines a section of html to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser |
<script> |
is used to embed or reference an executable script within an HTML or XHTML document |
These elements let you provide indications that specific parts of the text have been altered.
Element | Description |
---|---|
<del> |
represents a range of text that has been deleted from a document |
<ins> |
represents a range of text that has been added to a document |
The elements here are used to create and handle tabular data.
Element | Description |
---|---|
<caption> |
represents the title of a table |
<col> |
defines a column within a table and is used for defining common semantics on all common cells |
<colgroup> |
defines a group of columns within a table |
<table> |
represents data in two dimensions or more |
<tbody> |
defines one or more <tr> element data-rows to be the body of its parent <table> element |
<td> |
defines a cell of a table that contains data. It participates in the table model |
<tfoot> |
defines a set of rows summarizing the columns of the table |
<th> |
defines a cell that is a header for a group of cells of a table |
<thead> |
defines a set of rows defining the head of the columns of the table |
<tr> |
defines a row of cells in a table |
HTML provides a number of elements which can be used together to create forms which the user can fill out and submit to the Web site or application. There's a great deal of added information about this available in the HTML forms guide.
Element | Description |
---|---|
<button> |
represents a clickable button |
<datalist> |
contains a set of <option> elements that represent the values available for other controls |
<fieldset> |
is used to group several controls as well as labels (<label> ) within a web form |
<form> |
represents a document section that contains interactive controls to submit information to a web server |
<input> |
is used to create interactive controls for web-based forms in order to accept data from the user |
<keygen> |
exists to facilitate generation of key material, and submission of the public key as part of an HTML form |
<label> |
represents a caption for an item in a user interface |
<legend> |
represents a caption for the content of its parent <fieldset> |
<meter> |
represents either a scalar value within a known range or a fractional value |
<optgroup> |
creates a grouping of options within a <select> element |
<option> |
is used to create a control representing an item within a <select> , an <optgroup> or a <datalist> HTML5 element |
<output> |
represents the result of a calculation or user action |
<progress> |
is used to view the completion progress of a task |
<select> |
represents a control that presents a menu of options |