HTML 5 Reference

A Web Developer’s Guide to HTML 5 W3C Editor’s Draft 23 March 2009
This version: http://www.w3.org/TR/2009/ED-html5-author-20090323 Latest version: http://www.w3.org/TR/ Previous version: No previous versions. Editors: Lachlan Hunt (Opera Software ASA) lachlan.hunt@lachy.id.au [Copyright licence pending]

Abstract
This document illustrates how to write HTML 5 documents, focussing on simplicity and practical applications for beginners while also providing in depth information for more advanced web developers.

Status of this document
This section describes the status of this document at the time of its publication. Other documents may supersede this document. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at http://www.w3.org/TR/. This document is an Editors Draft of the “HTML 5 Reference” produced by the HTML Working Group, part of the HTML Activity. The working group is working on HTML 5 (see the HTML 5 Editor's draft). The appropriate forum for comments on this document is public-html-comments@w3.org (public archive) or publichtml@w3.org (public archive). Publication as a Working Group Note does not imply endorsement by the W3C Membership. This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.

This document was produced by a group operating under the 5 February 2004 W3C Patent Policy. W3C maintains a public list of any patent disclosures made in connection with the deliverables of the group; that page also includes instructions for disclosing a patent. An individual who has actual knowledge of a patent which the individual believes contains Essential Claim(s) must disclose the information in accordance with section 6 of the W3C Patent Policy.

Table of contents
1. 1 Introduction 2. 2 Getting Started with HTML 5 1. 2.1 A Basic Document 2. 2.2 Understanding Semantics 3. 3 The HTML and XHTML Syntax 1. 3.1 Syntactic Overview 2. 3.2 The Syntax 1. 3.2.1 DOCTYPE Declaration 1. 3.2.1.1 Historical Notes 2. 3.2.2 Elements 3. 3.2.3 Attributes 1. 3.2.3.1 Empty Attributes 2. 3.2.3.2 Unquoted Attribute Values 3. 3.2.3.3 Double-Quoted Attribute Values 4. 3.2.3.4 Single-Quoted Attribute Values 4. 3.2.4 Comments 5. 3.2.5 Text 6. 3.2.6 CDATA Sections 7. 3.2.7 Character References 3. 3.3 Understanding MIME Types 4. 3.4 Character Encoding 5. 3.5 Choosing HTML or XHTML 6. 3.6 Polyglot Documents 4. 4 The HTML Vocabulary and APIs 1. 4.1 Categories 1. 4.1.1 Metadata Content 2. 4.1.2 Flow content 3. 4.1.3 Sectioning root 4. 4.1.4 Sectioning content 5. 4.1.5 Heading content 6. 4.1.6 Phrasing content 7. 4.1.7 Embedded content 8. 4.1.8 Interactive content 9. 4.1.9 Transparent Content Models 2. 4.2 Global Attributes 3. 4.3 The Elements 1. 4.3.1 The Root Element 1. 4.3.1.1 The html element 2. 4.3.2 Document Metadata 1. 4.3.2.1 The head element 2. 4.3.2.2 The title element

3.

4.

5.

6.

4.3.2.3 The base element 4.3.2.4 The link element 4.3.2.5 The meta element 4.3.2.6 The style element 4.3.3 Scripting 1. 4.3.3.1 The script element 2. 4.3.3.2 The noscript element 4.3.4 Sections 1. 4.3.4.1 The body element 2. 4.3.4.2 The section element 3. 4.3.4.3 The nav element 4. 4.3.4.4 The article element 5. 4.3.4.5 The aside element 6. 4.3.4.6 The h1, h2, h3, h4, h5, and h6 elements 7. 4.3.4.7 The header element 8. 4.3.4.8 The footer element 9. 4.3.4.9 The address element 4.3.5 Grouping Content 1. 4.3.5.1 The p element 2. 4.3.5.2 The hr element 3. 4.3.5.3 The br element 4. 4.3.5.4 The pre element 5. 4.3.5.5 The dialog element 6. 4.3.5.6 The blockquote element 7. 4.3.5.7 The ol element 8. 4.3.5.8 The ul element 9. 4.3.5.9 The li element 10. 4.3.5.10 The dl element 11. 4.3.5.11 The dt element 12. 4.3.5.12 The dd element 4.3.6 Text-Level Semantics 1. 4.3.6.1 The a element 2. 4.3.6.2 The q element 3. 4.3.6.3 The cite element 4. 4.3.6.4 The em element 5. 4.3.6.5 The strong element 6. 4.3.6.6 The small element 7. 4.3.6.7 The mark element 8. 4.3.6.8 The dfn element 9. 4.3.6.9 The abbr element 10. 4.3.6.10 The time element 11. 4.3.6.11 The progress element 12. 4.3.6.12 The meter element 13. 4.3.6.13 The code element 14. 4.3.6.14 The var element 15. 4.3.6.15 The samp element 16. 4.3.6.16 The kbd element 17. 4.3.6.17 The sub and sup elements 18. 4.3.6.18 The span element
3. 4. 5. 6.

19. 4.3.6.19 20. 4.3.6.20 21. 4.3.6.21 22. 4.3.6.22 23. 4.3.6.23 24. 4.3.6.24

The i element The b element The bdo element The ruby element The rt element The rp element

7. 4.3.7 Edits 1. 4.3.7.1 The ins element 2. 4.3.7.2 The del element 8. 4.3.8 Embedded Content 1. 4.3.8.1 The figure element 2. 4.3.8.2 The img element 3. 4.3.8.3 The iframe element 4. 4.3.8.4 The embed element 5. 4.3.8.5 The object element 6. 4.3.8.6 The param element 7. 4.3.8.7 The video element 8. 4.3.8.8 The audio element 9. 4.3.8.9 The source element 10. 4.3.8.10 The canvas element 11. 4.3.8.11 The map element 12. 4.3.8.12 The area element 9. 4.3.9 Tabular Data 1. 4.3.9.1 The table element 2. 4.3.9.2 The caption element 3. 4.3.9.3 The colgroup element 4. 4.3.9.4 The col element 5. 4.3.9.5 The tbody element 6. 4.3.9.6 The thead element 7. 4.3.9.7 The tfoot element 8. 4.3.9.8 The tr element 9. 4.3.9.9 The td element 10. 4.3.9.10 The th element 10. 4.3.10 Forms 1. 4.3.10.1 The form element 2. 4.3.10.2 The fieldset element 3. 4.3.10.3 The label element 4. 4.3.10.4 The input element 5. 4.3.10.5 The button element 6. 4.3.10.6 The select element 7. 4.3.10.7 The datalist element 8. 4.3.10.8 The optgroup element 9. 4.3.10.9 The option element 10. 4.3.10.10 The textarea element 11. 4.3.10.11 The output element 11. 4.3.11 Interactive Elements 1. 4.3.11.1 The details element 2. 4.3.11.2 The command element 3. 4.3.11.3 The bb element

3.1. 4.4 The menu element 12. 6. Tips and Warnings 2. The second section provides an in depth look at the syntax of HTML and XHTML documents. Additionally. and the use of quality assurance tools. 5 Index of Elements 1.12 Miscellaneous Elements 1. depending on your needs. to . vocabulary and its associated DOM APIs and is intended for web site and application developers. Each element is described.12.2 Obsolete Elements 3. covering the fundamental techniques and best practices. That is. 6. providing details about its its meaning. 6 How to Read This Guide 1. 2 Getting Started with HTML 5 The most common format for publishing documents on the web and creating web applications is HTML.1 Conforming Elements 2. publishers.1 Notes.11. This guide is structured into three major sections. 6. allowed attributes.3 Comparison of HTML 4.1.2. 5.1. 6. 6.3 Namespaces 1 Introduction This document serves as a reference guide for the HTML syntax.1.4.3. From its beginning as a relatively simple language primarily designed for describing scientific documents. This will investigate both the similarities and differences between the two alternatives and provides guidance on choosing which to use for your own projects.1 The legend element 2. explaining the basic structure and syntax of an HTML document. tutorial writers and teachers and their students.3. 5.2.2. encouraging the use of clean and valid markup.01 and HTML 5 Elements 6. or who teach others to do so.12.2 Void Elements 3. The first provides an introductory tutorial on writing HTML. documents that     conform to both HTML and XHTML simultaneiously—including issues related to     ensuring stylesheets and scripts work correctly under both conditions. 4.2 The div element 5. 4.3. 5.1 Conventions 1. people who write documents using HTML.1 Attributes 2. content models and DOM APIs. The third and final section provides a reference for the HTML vocabulary. it has grown and adapted to a wide variety needs ranging from publishing news and blogs. Each is accompanied by clear examples illustrating how the element is designed to be used for a range of different use cases. 6. this will also provide details about creating polyglot documents—that is. 4.2 Example Markup 1.1.

All HTML documents need to begin with a DOCTYPE. and the body. as illustrated in the following diagram. it is needed to ensure that web browsers interpret the document correctly.2 Understanding Semantics In general.html To begin. and is suitable for beginners. so that it never gets forgotten. maps.providing the foundation for full blown applications for email. The DOCTYPE is a remnant from the early days of the web. word processing and spreadsheets. the demands placed upon it by authors have increased and the limitations of HTML become more pronounced. empty file. stylesheets and scripts. An HTML document is divided into two main sections. As the uses of HTML have grown. Authors who are familiar with previous versions of HTML are advised to familiarise themselves with the differences from HTML 4 [HTML4DIFF] This section provides an introductory tutorial to help get you started with HTML. type the following on the first line. such as telling a story. I suggest you save the file as example01. In your text editor. reporting news and current affairs or describing available products and . such as the title. Experienced authors may choose to skip this section and proceed to the syntax overview and the element reference. which contain all of the page’s content. The markup itself forms a tree structure. This could be any kind of information. introducing a wide range of new features into the language. This document will simply contain a title and short paragraph. 2. 2. and save the file. which will also serve as a useful template for future HTML documents. HTML 5 is represents the next major step in the development of HTML. The head. For historical reasons. the purpose of writing and publishing a document is to convey information to the readers.1 A Basic Document The goal of this section is to walk people though creating example01. rather than using a special compatibility mode designed to replicate the behaviour of older browsers.html. Open a text editor and create a new. <!DOCTYPE html> Because this is required for all documents. we’re going to create a very basic HTML document. which is used to contain document metadata. it is good practice to get in the habit of always typing that as the first line in all new HTML documents you create.

it’s still a heading and the markup can still uses the same basic elements for identifying common structures. paragraphs. In one document.services. a heading may be presented visually in a large bold typeface with wide margins above and below to separate it from the surrounding content and make it stand out. news article. lists. But regardless of the presentation. and its presentation. Consider this set of elements to be analogous to the list of words in a dictionary. links. It’s important to distinguish between the structure and semantics of content. Similarly. fancy script typeface. a heading may be presented in a light coloured. 3 The HTML and XHTML Syntax It is useful to make a distinction between the vocabulary of an HTML document —the elements and attributes. HTML has a defined set of elements and attributes which can be used in a document. each designed for a specific purpose with their own meaning. italic. are more generic and rather than focussing on describing the presentation. which should be described using HTML. semantics and/or style. it needs to be conveyed to the reader in a way that can be easily understood. tables. blog entry or letter is often grouped into different sections containing a variety of headings. quotes and various other typographical structures. . Others. Some markup languages are designed solely for the purpose of describing the presentation of the document. and HTML in particular. There are heading elements for marking up different levels of headings. they are designed to focus on describing the meaning or purpose of the content and leave the presentation for another layer to deal with. HTML provides a wide variety of semantic elements that can be used to mark up various common typographical structures. HTML has rules for where and how each element and attribute can be used. All of these structures are important for more easily conveying information to the reader. A typical document. lists. HTML provides the means to clearly identify each of these structures in a way that can then be easily presented to the user. this is the purpose of markup. such as HTML. and a table elements for marking up tables. such as an book. just as natural languages have grammatical rules for how different words can be used. various list elements for marking up different types of lists. Whatever the information is. such as RTF (Rich Text Format). In essence. paragraphs. a paragraph (p) element for paragraph. form controls and many other features. Markup is a machine readable language that describes aspects of a document such as its structure. tables. This includes elements for headings. and their meanings—and the syntax in which it is written. This is the vocabulary of HTML. In another document.

1 Syntactic Overview There are two syntaxes that can be used: the traditional HTML syntax. is based on the much more strict XML syntax.01. Most elements have at most one parent element. XHTML Example: <html xmlns="http://www. such as allowing the omission of some optional tags and attribute values. While this too is inspired by SGML. this syntax requires documents to be well-formed. The following example illustrates a basic HTML document. </body> </html> XHTML. Authors are free to choose whether or not they wish to take advantage of these shorthand features based upon their own personal preferences. 3.org/1999/xhtml"> <head> <title>An HTML Document</title> </head> <body class="example"> <h1>Example</h1> <p>This is an example HTML document.The basic structure of elements in an HTML document is a tree structure. and has a number of convenient shorthands for authors to use. The former is more lenient in its design and handling requirements. The latter is based on XML and has much stricter syntactic requirements. though very widely used syntax from HTML 4. designed to discourage the proliferation of syntactic errors. designed to make hand coding more convenient. forcing authors to maintain cleaner markup. (except for the root element). demonstrating some shorthand syntax: HTML Example: <!DOCTYPE html> <html> <head> <title>An HTML Document</title> </head> <body class=example> <h1>Example</h1> <p>This is an example HTML document. however. which some people prefer because of its stricter error handling. and may have any number of child elements. Although it is inspired by its SGML origins. and the XHTML syntax. The HTML syntax is loosely based upon the older.w3. This structure needs to be reflected in the syntax used to write the document. it really only shares minor syntactic similarities. each is optimised for different needs and authoring habits. While these are similar. This features a range of shorthand syntaxes.</p> </body> . in practice.

. however.1 DOCTYPE Declaration The Document Type Declaration needs to be present at the beginning of a document that uses the HTML syntax. These include the DOCTYPE declaration.</html> Note: The XHTML document does not need to include the DOCTYPE because XHTML documents that are delivered correctly using an XML MIME type and are processed as XML by browsers. software that outputs HTML documents — an alternative DOCTYPE is available for use by systems that are unable to output the DOCTYPE given above. Due to the similarities of both the HTML and XHTML syntaxes. The canonical DOCTYPE that most HTML documents should use is as follows: <!DOCTYPE html> For compatibility with legacy producers of HTML — that is. and is unable to omit them. 3. are always rendered in no quirks mode. It may optionally be used within the XHTML syntax. except for the quoted string "about:legacy-compat".2 The Syntax There are a number of basic components make up the syntax of HTML. in practice. which. it is possible to mark up documents using a common subset of the syntax that is the same in both. may also be quoted with single quotes. The canonical form of this DOCTYPE is as follows: <!DOCTYPE html SYSTEM "about:legacy-compat"> Note: The term "legacy-compat" refers to compatibility with legacy producers only. the DOCTYPE is case insensitive. This limitation occurs in software that expects a DOCTYPE to include either a PUBLIC or SYSTEM identifier. This quoted string. the DOCTYPE may optionally be included. attributes. There are a number of issues involved with creating such documents and authors wishing to do so should familiarise themselves with the similarities and differences between HTML and XHTML. rather than double quotes. and is ever expected to be used in text/html environments. ignore SYSTEM identifiers and DTDs. comments. The emphasised parts below illustrate which parts are case insensitive. which must be written in lower case. while avoiding the syntactic sugar that is unique to each. elements. However. it does not refer to compatibility with legacy browsers. text and CDATA sections. and should be included if the document uses the compatible subset of markup that is conforming in both HTML and XHTML. This type of document is known as a polyglot document because it simultaneously conforms to both syntaxes and may be handled as either. but it is not required.2. that are used throughout any document. In particular. 3. In HTML.

typically for validation purposes. should you wish to use a DOCTYPE.HTML Example: <!DOCTYPE html> <!DOCTYPE html SYSTEM "about:legacy-compat"> <!DOCTYPE html SYSTEM 'about:legacy-compat'> The following are also valid alternatives in the HTML syntax: HTML Example: <!doctype html> <!DOCTYPE HTML> <!doctype html system 'about:legacy-compat'> <!Doctype HTML System "about:legacy-compat"> For XHTML. and only the canonical versions of these DOCTYPEs given above may be used. in previous levels of HTML. Although. The DOCTYPE originates from HTML’s SGML lineage and. there are no restrictions placed on the use of alternative DOCTYPEs in XHTML. attributes and syntactic features that could be used within the document.1 Historical Notes This section needs revising and may be moved to an external document and simply referred to. XHTML Example: <!DOCTYPE html> <!DOCTYPE html SYSTEM "about:legacy-compat"> <!DOCTYPE html SYSTEM 'about:legacy-compat'> However.2. was originally used to refer to a Document Type Definition (DTD) — a formal declaration of the elements. Also. if you wish. note that the DOCTYPE is case sensitive. use a custom DOCTYPE referring to a custom DTD. Those who are familiar with previous levels of HTML will notice that there is no PUBLIC identifier present in this DOCTYPE. 3. it is recommended that the DOCTYPE be omitted because it is unnecessary. be advised that DTDs have a number of limitations compared with other alternative schema languages and validation techniques. note that the about: URI scheme in the SYSTEM identifier of the latter DOCTYPE is used specifically because it cannot be resolved to any specific DTD. You may.1. However. . which were used to refer to the DTD.

the above syntax cannot be used for void elements.As HTML5 is no longer formally based upon SGML. tag names are case insensitive and may be written in all uppercase or mixed case. are forbidden from containing any content at all. The reason for this is due to backwards compatibility. In HTML. In HTML. due to legacy constraints. however it is usually omitted because it’s redundant. however. In general.</DIV> An empty element is any element that does not contain any content within it. These are known as void elements.. 3. limited quirks mode and no quirks mode. hr. among others. however. Tags are delimited using angle brackets with the tag name in between. and thus no longer needs to refer to a DTD. whitespace is permitted between the tag name and the closing right angle bracket. HTML 5 defines three modes: quirks mode. The case of the start and end tags do not have to be the same. and to ensure the most standards compliant rendering. an empty element is just one with a start tag immediately followed by its associated end tag. However.2. the DOCTYPE no longer serves this purpose. HTML Example: <DIV>. Example: This example paragraph illustrates the use of start tags and end tags. tag names are case sensitive and are usually defined to be written in lowercase. of which only the latter is considered conforming to use. link and meta . but being consistent does make the code look cleaner. In both HTML and XHTML syntaxes. it is important to ensure no-quirks mode is used. <p>The quick brown fox jumps over the lazy dog. Such elements include. Example: <span></span> Some elements. br. In XHTML. this can be represented in the same way. The difference between start tags and end tags is that the latter includes a slash before the tag name.</p> In both tags. it has gained another very important purpose: triggering no-quirks mode in browsers. although the most common convention is to stick with lowercase. For such elements.. the end tag must be omitted because the element is automatically closed by the parser.2 Elements Elements are marked up using start tags and end tags. The important thing to understand is that there are some differences in the way documents are visually rendered in each of the modes.

depending on your own preferences.css"> In XHTML. <div class="example">.0.3 Attributes Elements may contain attributes that are used to set various properties of an element. and so they could be written in all uppercase or mixed case. while others are defined for specific elements only. It is conventional. Some attributes are defined globally and can be used on any element. All attributes have a name and a value and look like this. Some authors also choose to include whitespace before the slash. to use the same case as would be used in XHTML. This is achieved by inserting a slash at the end of the start tag immediately before the right angle bracket. Appendix C.2. In HTML.) 3. attribute names are case sensitive and most are defined to be lowercase.HTML Example: <link type="text/css" rel="stylesheet" href="style. or the empty element syntax.. attribute names are case insensitive. Example: This example illustrates how to mark up a div element with an attribute named class using a value of "example".. (Using whitespace in that fashion is a convention inherited from the compatibility guidelines in XHTML 1. however this is not necessary. however.. which is generally all lowercase.. Example: <link type="text/css" href="style. as above. HTML Example: <div CLASS="example"> . Erroneous Example: <section id="example">.</div> Attributes may only be specified within start tags and must never be used in end tags. the XML syntactic requirements dictate that this must be made explicit using either an explicit end tag.css"/> Authors may optionally choose to use this same syntax for void elements in the HTML syntax as well.</section id="example"> In XHTML.

.</div> Note: The previous example is semantically equivalent to specifying the attribute with the value "disabled". they either need . If you need an attribute to contain those characters.</div> The previous example is equivalent to specifying the attribute with an empty string as the value. it was technically an attribute’s name that could be omitted where the value was a unique enumerated value specified in the DTD. HTML Example: <input disabled>. although depending on the syntax used. depending on what is needed for each specific attribute. Example: <img src="decoration.2 Unquoted Attribute Values In HTML. the quotes surrounding the value may also be omitted in most cases. this has been changed in HTML5 to reflect the way implementations really work.In general. single or double quotes (' or ").2. which are outlined below.1 Empty Attributes An empty attribute is one where the value has been omitted. <input disabled="">. unquoted. However. an equals sign (=) or a greater-than symbol (>). attribute values must always be quoted using either single or double quotes.. This syntax may be used in the HTML syntax. due to legacy constraints. some additional restrictions apply. but not in the XHTML syntax. However. and is commonly used for boolean attributes. 3.. but it is not exactly the same. There are four slightly different syntaxes that may be used for attributes in HTML: empty. single-quoted and double-quoted. All four syntaxes may be used in the HTML syntax..png" alt=""> 3. <img src="decoration.3. Note: In previous editions of HTML.3. The value may contain any characters except for spaces.2.png" alt> The previous example is equivalent to specifying the attribute with an empty string as the value. which were formally based on SGML. in the XHTML syntax. the values of attributes can contain any text or character references. This is a syntactic shorthand for specifying the attribute with an empty value. but not in XHTML.

</div> 3.3.2. equals signs (=) or greater than signs (>)..2... Example: <div class="example class names">.2. Example: <div class='example class names'>.6 CDATA Sections . Some additional characters cannot be used in unquoted attribute values. but for obvious reasons. HTML Example: <div class=example> 3.7 Character References . or you need to use either the singleor double-quoted attribute values. By quoting attributes.. By quoting attributes. the value may contain the additional characters that can’t be used in unquoted attribute values.. 3.2..2. these attributes cannot contain additional double quotation marks within the value.to be escaped using character references.3. but for obvious reasons.2. single (') or double (") quotation marks. 3..5 Text ..4 Single-Quoted Attribute Values In both HTML and XHTML.</div> 3. attribute values may be surrounded with double quotes.4 Comments . attribute values may be surrounded with single quotes.3 Double-Quoted Attribute Values In both HTML and XHTML.. 3. these attributes cannot contain additional single quotation marks within the value. the value may contain the additional characters that can’t be used in unquoted attribute values.. including space characters.

which MIME type the document will ultimately be served as. and that authors are encouraged to make an informed decision.3 Understanding MIME Types Discuss text/html. level of support in browsers used by the site’s target audience. This includes not only syntactic differences. 3. the skill set of the developers involved. Need to develop guidelines to help authors make this choice. 3. XHTML article.Discuss numeric and named character reference syntax. This works by using a common subset of the syntax that is shared by both HTML and XHTML. 4 The HTML Vocabulary and APIs . Declaring the encoding with the Content-Type header. In order to successfully create and maintain polyglot documents. May link to the list of entity references in a separate document. and which can be processed as either by browsers. depending on the support in particular browsers. rather than trying to list them all in here. BOM. etc.4 Character Encoding Overview of Unicode. meta. and provide guidelines on the creation of polyglot documents. 3. etc. but also differences in the way stylesheets. or it may simply be a matter of personal preference.6 Polyglot Documents A polyglot HTML document is a document that conforms to both the HTML and XHTML syntactic requirements. etc. including needs of a given project. 3. character repertoires. or when it is not known at the time of creation. and the way in which character encodings are detected. application/xhtml+xml. Base this on the HTML vs. depending on the MIME type used. This section will provide the details about each of these similarities and differences. authors need to be familiar with both the similarities and differences between the two syntaxes. The important thing to understand is that there are valid reasons to choose both. and scripts are handled.5 Choosing HTML or XHTML The choice of HTML or XHTML syntax is largely dependent upon a number of factors the. Polyglot documents are useful to create for situations where a document is intended to be served as either HTML or XHTML. encodings.

These categories are related as follows: [Create and link to some sort of index of elements that lists each element in each category. Metadata elements appear within the head of a document. p.2 Flow content Most elements that are used in the body of documents and applications are categorised as flow content.1. Some common examples of metadata elements include: title.4. 4. phrasing content or embedded content are also considered to be flow content. Elements categorised as heading content. meta. or indicate relationships with other documents.] 4.1. In general. Most of the elements used to mark up the main content in the body of a page are considered to be flow content. em and strong. this includes elements that are presented visually as either block level or inline level.] . link. Some common flow content includes elements like div.1 Categories Each element in HTML falls into zero or more categories that group elements with similar characteristics together.1. marking up or linking to resources that describe the behaviour or presentation of the document. script and style.1 Metadata Content Metadata content includes elements for marking up document metadata. The following categories are used in this guide: • • • • • • • • • Metadata content Flow content Sectioning root Sectioning content Heading content Phrasing content Embedded content Interactive content Transparent Some elements have unique requirements and do not fit into any particular category. 4.3 Sectioning root [This description needs improving.

5 Heading content Heading content includes the elements for marking up headers. videos and Flash-based content. Heading content includes the header element and the h1 to h6 elements. for example. are used to describe the the structure of the document. object. article and nav. This is similar to the concept of inline level elements in HTML 4.8 Interactive content .1. and thus also considered to be flow content. embed and video. Some common sectioning root elements include. Most sectioning elements. with the exception of the body element. section. 4. Such external resources include.1. Elements categorised as heading content are considered to be flow content. Some common sectioning elements include. footers and contact information apply. Some embedded content elements include img.1. 4. but the sections and headers inside these elements do not contribute to the outlines of their ancestors. 4. strong and span Elements categorised as phrasing content are considered to be flow content.1. Headings. These elements provide a scope within which associated headers. each of which generally has its own heading.4 Sectioning content Sectioning content is used for structuring a document into sections. 4. among others.These elements can have their own outlines.7 Embedded content Embedded content includes elements that load external resources into the document. among others.6 Phrasing content Phrasing content includes text and text-level markup. blockquote and figure. Elements categorised as embedded content are considered to be phrasing content. Some common examples of phrasing content elements include abbr. in conjunction with the sectioning elements. images. em. Most elements that are categorised as phrasing content can only contain other phrasing content.1. 4. body. are also classified as flow content.01.

Each of these needs longer descriptions and the elements should be divided into categories. Contained By: • As the root element of a document.1. this could be performed using any kind of input device.3 The Elements Expect major changes to this section.1. 4. and most form controls using input. The IDL for the DOM Interfaces is likely to be replaced by something a lot more reader-friendly in the future. such as. They may contain any content that their parent element may contain. 4. for example. • Wherever a subdocument fragment is allowed in a compound document. then the content model defaults to flow content. Start tag: optional End tag: optional Categories: • None. 4. touch screen or voice input.Interactive elements are those that allow the user to interact with or activate in some way.1 The html element The html element represents the root of an HTML document. 4. Depending on the user’s browser and device. audio and video when used with the controls attribute. keyboard. consider it a placeholder for now.3.1 The Root Element 4. in addition to fuller descriptions and examples afterwards. When the element has no parent. Some common examples of interactive content include a. Attributes will likely be accompanied by brief descriptions within the summary box. meaning that their allowed content depends upon the parent element.9 Transparent Content Models Some elements have transparent content models. in addition to any other allowances or exceptions described for the element.2 Global Attributes To be completed. a mouse. .3.

both the start and end tags are optional. </head> <body> .... </head> <body> .org/1999/xhtml" xml:lang="en"> <head> . </body> . HTML Example: <!DOCTYPE html> <html lang="en"> <head> . the xmlns attribute needs to be specified on this element to declare that it is in the HTML namespace. and so for convenience either may be omitted. at least the start tag needs to be included. The html element is the root element of a document. XHTML Example: <html xmlns="http://www. in which case... unless you wish to specify attributes on this element.Content • A head element followed by a body element.. and it must contain both the head and body elements. </body> In the XHTML syntax.w3. You may use either the lang or xml:lang attribute to specify the langauge. </body> </html> In the HTML syntax only. HTML Example: <!DOCTYPE html> <head> ... Model: ATTRIBUTES • Global attributes • manifest DOM INTERFACE • Uses HTMLElement... Every document must begin with this element.. It is considered good practice to specify the primary language of the document on this element using the lang attribute.. </head> <body> .

3. Metadata is information about the document itself. As the first element in an html element.3. the attribute’s value must be a valid URL. author. Scripts and stylesheets may also be included within the head element. If the attribute is present. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. The head element is the container for the document’s metadata. Every document must have a head element. of which exactly one is a title element. 4. HTML Example <!DOCTYPE html> <html> <head> <title>Example</title> </head> <body> <h1>Document</h1> </body> </html> XHTML Example .1 The head element The head element collects the document’s metadata.2 Document Metadata 4. The following examples illustrate the typical usage of the head element in HTML and XHTML.</html> manifest The manifest attribute gives the address of the document’s application cache manifest. Contained By: • Content Model: • One or more elements of metadata content. Need to describe application cache manifests. such as it's title. if there is one. Start tag: optional End tag: optional Categories: • None.2.

2.org/1999/xhtml"> <head> <title>Example</title> </head> <body> <h1>Document</h1> </body> </html> 4.<html xmlns="http://www. In a head element containing no other title elements. and should be meaningful even when read out of context. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.2. Contained By: • Content • Text. Start tag: required End tag: required Categories: • Metadata content.2 The title element The title element represents the document’s title or name. DOM INTERFACE . Model: ATTRIBUTES • Global attributes • • href target • interface HTMLBaseElement : HTMLElement { • attribute DOMString href.w3. Contained By: • Content • Empty.3.3. 4. Start tag: required End tag: empty Categories: • Metadata content.3 The base element The base element is for specifying a base URL against which relative links will be resolved. and the name of the default target for opening links and form submissions. In a head element containing no other base elements.

Model: ATTRIBUTES • Global attributes • • • • • • • href rel media hreflang type sizes Also. • }. the title attribute has special semantics on this element. • attribute DOMString type.• • }. such as stylesheets.4 The link element The link is for linking to other resources. such as the application-name or specifying the documents character encoding. Start tag: required . • attribute DOMString media. • interface HTMLLinkElement : HTMLElement { • attribute boolean disabled. favicons and syndication feeds.2.3. [CSSOM] 4. • attribute DOMString hreflang. 4. Start tag: required End tag: empty Categories: • Metadata content.3. • readonly attribute DOMTokenList relList. • attribute DOMString href. • attribute DOMString sizes. attribute DOMString target. the styling processing model defines how. Contained By: • • Content • Empty. • attribute DOMString rel.5 The meta element The meta element is for providing various types of metadata. DOM INTERFACE The LinkStyle interface must also be implemented by this element. Where metadata content is expected.2. In a noscript element that is a child of a head element.

Contained By: • If the scoped attribute is absent: where metadata content is expected. Content • Empty. typically CSS. • attribute DOMString name. Contained By: • If the charset attribute is present. • }. • If the scoped attribute is present: where flow content is expected. Model: ATTRIBUTES • Global attributes • • • • name http-equiv content charset • interface HTMLMetaElement : HTMLElement { • attribute DOMString content.2.3. • If the http-equiv attribute is present. • If the http-equiv attribute is present. • If the scoped attribute is absent: in a noscript element that is a child of a head element.6 The style element The style element allows authors to embed stylesheets.End tag: empty Categories: • Metadata content. Start tag: required End tag: required Categories: • • Metadata content. and the element is not in the Encoding declaration state: in a head element. If the scoped attribute is present: flow content. or if the element is in the Encoding declaration state: in a head element. DOM INTERFACE 4. • If the name attribute is present: where metadata content is expected. within their documents. and the element is not in the Encoding declaration state: in a noscript element that is a child of a head element. • attribute DOMString httpEquiv. but before any other flow content other than other .

1 The script element The script element allows authors to include scripts. depends on the value of the attribute. Content • Depends on the value of the type attribute. typically javaScript. Model: ATTRIBUTES • Global attributes • • • • media type scoped Also. • interface HTMLStyleElement : HTMLElement { • attribute boolean disabled. Where phrasing content is expected.3. Start tag: required End tag: required Categories: • • • Metadata content. Flow content. • type ATTRIBUTES • Global attributes • • • src async defer . Contained By: • • Content Model: If there is no src attribute.3. • attribute DOMString type. and data blocks in their documents.3. • attribute DOMString media. • If there is a src attribute. Phrasing content. • }. DOM INTERFACE The LinkStyle interface must also be implemented by this element. the styling processing model defines how. Where metadata content is expected. [CSSOM] 4. the element must be either empty or contain only script documentation.3 Scripting 4. the title attribute has special semantics on this element.style elements and inter-element whitespace. • attribute boolean scoped.

• •

type charset • interface HTMLScriptElement : HTMLElement { • attribute DOMString src; • attribute boolean async; • attribute boolean defer; • attribute DOMString type; • attribute DOMString charset; • attribute DOMString text; • };

DOM INTERFACE

4.3.3.2 The noscript element The noscript element is used to provide alternative content for users using browsers that do not support scripting or have it disabled. Start tag: required End tag: required Categories:
• • •

Metadata content. Flow content. Phrasing content.

Contained By: • In a head element of an HTML document, if there are no ancestor noscript elements. • Where phrasing content is expected in HTML documents, if there are no ancestor noscript elements. Content Model: When scripting is disabled, in a head element: in any order, zero or more link elements, zero or more style elements, and zero or more meta elements. • When scripting is disabled, not in a head element: transparent, but there must be no noscript element descendants. • Otherwise: text that conforms to the requirements given in the prose.

ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4 Sections 4.3.4.1 The body element The body element represents the main content of the document.

Start tag: optional End tag: optional Categories:

Sectioning root. As the second element in an html element.

Contained By: •

Content • Flow content. Model: ATTRIBUTES • Global attributes
• • • • • • • • • • • onbeforeunload onerror onhashchange onload onmessage onoffline ononline onpopstate onresize onstorage onunload • interface HTMLBodyElement : HTMLElement { • attribute Function onbeforeunload; • attribute Function onerror; • attribute Function onhashchange; • attribute Function onload; • attribute Function onmessage; • attribute Function onoffline; • attribute Function ononline; • attribute Function onpopstate; • attribute Function onresize; • attribute Function onstorage; • attribute Function onunload; • };

DOM INTERFACE

4.3.4.2 The section element The section element represents a generic document or application section. A section, in this context, is a thematic grouping of content, typically with a header and possibly a footer. Start tag: required End tag: required

Categories:

• •

Flow content. Sectioning content. Where flow content is expected.

Contained By: •

Content • Flow content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4.3 The nav element The nav element represents a section of a page containing primary navigation links to other pages or to parts within the page. Start tag: required End tag: required Categories:
• •

Flow content. Sectioning content. Where flow content is expected.

Contained By: •

Content • Flow content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4.4 The article element The article element represents an independent section of a document, page, or site. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, or any other independent item of content. Start tag: required End tag: required Categories:
• •

Flow content. Sectioning content. Where flow content is expected. Flow content.

Contained By: • Content Model:

ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4.5 The aside element 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. Start tag: required End tag: required Categories:
• •

Flow content. Sectioning content. Where flow content is expected.

Contained By: •

Content • Flow content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4.6 The h1, h2, h3, h4, h5, and h6 elements These elements define headers for their sections. Start tag: required End tag: required Categories:
• •

Flow content. Heading content. Where flow content is expected.

Contained By: •

Content • Phrasing content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.3.4.7 The header element

no sectioning content descendants. typically containing information such as who wrote it. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. no header element descendants.4. 4. and no footer element descendants. but with no heading content descendants. then it instead applies to the document as a whole. but no sectioning content descendants. links to related documents. Contained By: • Content Model: • Flow content.9 The address element The address element represents the contact information for the section it applies to. Start tag: required End tag: required Categories: • Flow content. and no footer element descendants.4. Start tag: required End tag: required Categories: • • Flow content.8 The footer element The footer element represents a footer of a section. typically containing headings and subheadings. . and other metadata about the section.3. and copyright notices. 4.3. If it applies to the body element. including at least one descendant that is heading content.The header element represents the header of a section. Where flow content is expected. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Heading content. Contained By: • Content Model: • Flow content. Where flow content is expected.

e. or a transition to another topic within a section of a reference book. 4.3. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. but with no heading content descendants.1 The p element The p element represents a paragraph. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.5.5 Grouping Content 4.g.2 The hr element The hr element represents a paragraph-level thematic break. Where flow content is expected. 4.3. . Contained By: • Content • Phrasing content.3.5. and no address element descendants. Start tag: required End tag: optional Categories: • Flow content. Start tag: required End tag: empty Categories: • Flow content. Where flow content is expected.Start tag: required End tag: required Categories: • Flow content. no footer element descendants. no sectioning content descendants. Contained By: • Content Model: • Flow content. a scene change in a story.

4 The pre element The pre element represents a block of preformatted text. in which structure is represented by typographic conventions rather than by elements. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Where flow content is expected. 4. 4.3. Content • Empty.3. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.5.Contained By: • Where flow content is expected. Start tag: required End tag: empty Categories: • • Flow content.5 The dialog element . Phrasing content. Contained By: • Content • Empty. Where phrasing content is expected. Start tag: required End tag: required Categories: • Flow content. 4. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.5.5.3 The br element The br element represents a line break.3.

Contained By: • Content Model: • Zero or more pairs of one dt element followed by one dd element. Sectioning root.The dialog element represents a conversation. Where flow content is expected. 4.6 The blockquote element The blockquote element represents a section that is quoted from another source. Start tag: required .5. Where flow content is expected.3. Contained By: • Content • Flow content. • }.7 The ol element The ol element represents an ordered list. DOM INTERFACE The HTMLQuoteElement interface is also used by the q element.3. Start tag: required End tag: required Categories: • • Flow content.5. 4. Model: ATTRIBUTES • Global attributes • cite • interface HTMLQuoteElement : HTMLElement { • attribute DOMString cite. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Start tag: required End tag: required Categories: • Flow content.

Contained By: • • . • }.3. Model: ATTRIBUTES • Global attributes • • reversed start • interface HTMLOListElement : HTMLElement { • attribute boolean reversed. Start tag: required End tag: required Categories: • Flow content. • attribute long start. Contained By: • Content • Zero or more li elements. Inside ul elements. Where flow content is expected. Contained By: • Content • Zero or more li elements.9 The li element The li element represents a list item. 4. Start tag: required End tag: optional Categories: • None. Inside ol elements.3. DOM INTERFACE 4.5.8 The ul element The ul element represents an unordered list. Where flow content is expected.End tag: required Categories: • Flow content.5. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.

Phrasing content.3. Model: ATTRIBUTES • Global attributes • If the element is a child of an ol element: value DOM INTERFACE • interface HTMLLIElement : HTMLElement { • attribute long value. (a description list).• Inside menu elements. Start tag: required End tag: required Categories: • Flow content. part of a talkerdiscourse pair in a conversation (dialog element). and the talker.5. or speaker. Where flow content is expected. or name. Contained By: • Content Model: • Zero or more groups each consisting of one or more dt elements followed by one or more dd elements. Before dd or dt elements inside dl elements. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.11 The dt element The dt element represents the term. Content • Flow content. part of a term-description group in a description list (dl element). 4. • }. Start tag: required End tag: optional Categories: • None. Before a dd element inside a dialog element. Contained By: • • Content Model: • .5. 4.10 The dl element The dl element introduces an association list containing groups of terms and associated descriptions.3.

6 Text-Level Semantics 4. part of a termdescription group in a description list (dl element).3. Transparent. part in a conversation (dialog element). or value. definition.3. Start tag: required End tag: optional Categories: • None. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4. then it represents a hyperlink. Contained By: • • Content • Flow content. or quote.6.ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. After a dt element inside a dialog element. Start tag: required End tag: required Categories: Interactive content.5. 4.12 The dd element The dd element represents the description. • Contained By: • Content Model: • Where phrasing content is expected.3. • Flow content. ATTRIBUTES • Global attributes • href . but there must be no interactive content descendant.1 The a element If the a element has an href attribute. and the discourse. After dt or dd elements inside dl elements. • When the element only contains phrasing content: phrasing content.

or any other creative work. 4. Start tag: required End tag: required Categories: • • Flow content. such as an article. • attribute DOMString media. • readonly attribute DOMTokenList relList. Where phrasing content is expected. Contained By: • Content • Phrasing content. Phrasing content. • attribute DOMString type. a film. Model: ATTRIBUTES • Global attributes • cite DOM INTERFACE • The q element uses the HTMLQuoteElement interface. Start tag: required End tag: . DOM INTERFACE The Command interface must also be implemented by this element. • attribute DOMString ping.3. a book. 4.3. • attribute DOMString hreflang.6. • attribute DOMString target. • attribute DOMString rel. a song. a poem.• • • • • • target ping rel media hreflang type • [Stringifies=href] interface HTMLAnchorElement : HTMLElement { • attribute DOMString href.6.2 The q element The q element represents a phrase quoted from another source.3 The cite element The cite element represents the title of a work. • }.

Start tag: required End tag: required Categories: • • Flow content. Contained By: • Content Model: ATTRIBUTES • . Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Contained By: • Content • Phrasing content. Where phrasing content is expected.6. Where phrasing content is expected. Phrasing content.4 The em element The em element represents stress emphasis of its contents. Start tag: required End tag: required Categories: • • Flow content.5 The strong element The strong element represents strong importance for its contents.required Categories: • • Flow content. Phrasing content. Contained By: • Content • Phrasing content.3.3. Where phrasing content is expected. Phrasing content. 4. Phrasing content.6. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. 4.

6.3. 4. due to its relevance in another context. Phrasing content.3. Contained By: • Content • Phrasing content. Where phrasing content is expected. Start tag: required End tag: required Categories: • • Flow content.6 The small element The small element represents small print (part of a document often describing legal restrictions. Where phrasing content is expected. Start tag: required End tag: required Categories: • • Flow content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.6.7 The mark element The mark element represents a run of text in one document marked or highlighted for reference purposes. or other side comments. 4.8 The dfn element . Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Phrasing content.3. Contained By: • Content • Phrasing content.• Global attributes DOM INTERFACE • Uses HTMLElement.6. such as copyrights or other disadvantages). 4.

Phrasing content. but there must be no descendant dfn elements. Phrasing content. ATTRIBUTES • Global attributes • Also.3.3.6. Start tag: required End tag: required Categories: • • Flow content. Where phrasing content is expected. DOM INTERFACE • Uses HTMLElement.10 The time element The time element represents a date and/or a time. 4. the title attribute has special semantics on this element.6. optionally with its expansion. the title attribute has special semantics on this element. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes • Also. Where phrasing content is expected.The dfn element represents the defining instance of a term. DOM INTERFACE • Uses HTMLElement. Start tag: required End tag: required Categories: • • Flow content. 4. where its definition is provided nearby. Contained By: • Content Model: • Phrasing content. Start tag: required End tag: .9 The abbr element The abbr element represents an abbreviation or acronym.

11 The progress element The progress element represents the completion progress of a task. Where phrasing content is expected.3. Phrasing content.6.required Categories: • • Flow content.12 The meter element The meter element represents a scalar measurement within a known range. • readonly attribute Date timezone. Start tag: required End tag: required Categories: • • Flow content. • readonly attribute float position. • }. Contained By: • Content • Phrasing content. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes • • value max • interface HTMLProgressElement : HTMLElement { • attribute float value. • readonly attribute Date time. • readonly attribute Date date. Phrasing content. • attribute float max. • }. DOM INTERFACE 4. DOM INTERFACE 4. Where phrasing content is expected. Model: ATTRIBUTES • Global attributes • datetime • interface HTMLTimeElement : HTMLElement { • attribute DOMString dateTime. or a fractional value.3. .6.

Phrasing content. DOM INTERFACE 4. Contained By: • Content • Phrasing content. • attribute float max. Where phrasing content is expected. • }. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Where phrasing content is expected. • attribute float optimum.6. • attribute float min. .13 The code element The code element represents a fragment of computer code.3. Model: ATTRIBUTES • Global attributes • • • • • • value min low high max optimum • interface HTMLMeterElement : HTMLElement { • attribute float value. • attribute float high. Start tag: required End tag: required Categories: • • Flow content.Start tag: required End tag: required Categories: • • Flow content. Phrasing content. • attribute float low.

Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.6. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Start tag: required End tag: required Categories: • • Flow content.3. 4. Contained By: • Content • Phrasing content.16 The kbd element The kbd element represents user input (typically keyboard input.4. such as voice commands).3. Contained By: • Content • Phrasing content.6. Where phrasing content is expected. Phrasing content.3. such as in a mathematical expression or programming context. Start tag: required End tag: .15 The samp element The samp element represents (sample) output from a program or computing system. 4. Start tag: required End tag: required Categories: • • Flow content.6.14 The var element The var element represents a variable. Where phrasing content is expected. or it could just be a term used as a placeholder in prose. Phrasing content. although it may also be used to represent other input.

but can be useful when used together with other attributes.18 The span element The span element doesn’t mean anything on its own.g. Contained By: • Content • Phrasing content. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. e. Phrasing content. Start tag: required End tag: required Categories: • • Flow content. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.6.3.17 The sub and sup elements The sup element represents a superscript and the sub element represents a subscript. Contained By: • Content • . 4. lang.required Categories: • • Flow content. or dir. Where phrasing content is expected. Phrasing content. class. Start tag: required End tag: required Categories: • • Flow content. Phrasing content.3. Where phrasing content is expected. 4. Where phrasing content is expected.6. Phrasing content.

Start tag: required End tag: required Categories: • • Flow content. Where phrasing content is expected. such as key words in a document abstract.Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. or other spans of text whose typical typographic presentation is boldened. a ship name.6.3.19 The i element The i element represents a span of text in an alternate voice or mood. Contained By: • Content • Phrasing content. Phrasing content. or some other prose whose typical typographic presentation is italicized. Where phrasing content is expected. an idiomatic phrase from another language. a thought. or otherwise offset from the normal prose.20 The b element The b element represents a span of text to be stylistically offset from the normal prose without conveying any extra importance. Phrasing content. product names in a review. 4. Contained By: • Content • Phrasing content.6. a technical term. Model: ATTRIBUTES • Global attributes . 4. such as a taxonomic designation.3. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. Start tag: required End tag: required Categories: • • Flow content.

Where phrasing content is expected. Where phrasing content is expected. primarily used in East Asian typography as a guide for pronounciation or to include other annotations. the dir global attribute has special semantics on this element. . Ruby annotations are short runs of text presented alongside base text.21 The bdo element The bdo element allows authors to override the Unicode bidi algorithm by explicitly specifying a direction override. and another rp element.6.3. Phrasing content.6.DOM INTERFACE • Uses HTMLElement. Start tag: required End tag: required Categories: • • Flow content.3. this form of typography is also known as furigana. [BIDI] Start tag: required End tag: required Categories: • • Flow content. Phrasing content. Contained By: • Content Model: • One or more groups of: phrasing content followed either by a single rt element. an rt element. 4. In Japanese.22 The ruby element The ruby element allows one or more spans of phrasing content to be marked with ruby annotations. or an rp element. Contained By: • Content • Phrasing content. Model: ATTRIBUTES • Global attributes • Also. 4. DOM INTERFACE • Uses HTMLElement. ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.

1 The ins element The ins element represents an addition to the document. 4. Content Model: If the rp element is immediately after an rt element that is immediately preceded by another rp element: a single character from Unicode character class Pe. Start tag: required End tag: required Categories: • None.4.23 The rt element The rt element marks the ruby text component of a ruby annotation. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. . As a child of a ruby element. 4. Start tag: required End tag: required Categories: • None.6.3.6. Contained By: • As a child of a ruby element.7. Contained By: • Content • Phrasing content.3.7 Edits 4. to be shown by user agents that don’t support ruby annotations.24 The rp element The rp element can be used to provide parentheses around a ruby text component of a ruby annotation.3. either immediately before or immediately after an rt element. • Otherwise: a single character from Unicode character class Ps.3. • ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.

• When the element only contains phrasing content: phrasing content. • Contained By: • Where phrasing content is expected.1 The figure element . Content • Transparent. Start tag: required End tag: required Categories: Flow content. Model: ATTRIBUTES • Global attributes • • cite datetime DOM INTERFACE • Uses the HTMLModElement interface. Model: ATTRIBUTES • Global attributes • • cite datetime DOM INTERFACE • Uses the HTMLModElement interface.3.8 Embedded Content 4. 4. • Contained By: • Where phrasing content is expected.Start tag: required End tag: required Categories: Flow content.7. 4.2 The del element The del element represents a removal from the document. • When the element only contains phrasing content: phrasing content.3.3. Content • Transparent.8.

The figure element represents some flow content. Contained By: • Content Model: • • • ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.2 The img element An img element represents an image. which can be moved away from the main flow of the document without affecting the document’s meaning. Or: Flow content followed by one legend element. Or: Flow content. Start tag: required End tag: required Categories: • • Flow content.8. Either: one legend element followed by flow content. Embedded content. optionally with a caption. 4. Sectioning root. Contained By: • Content • Empty. Where flow content is expected. Where embedded content is expected.3. If the element has an usemap attribute: Interactive content. Phrasing content. Model: ATTRIBUTES • Global attributes • • • • • • alt src usemap ismap width height DOM INTERFACE . Start tag: required End tag: empty Categories: • • • • Flow content.

ATTRIBUTES • Global attributes • • • • • • src name sandbox seamless width height • interface HTMLIFrameElement : HTMLElement { • attribute DOMString src. • readonly attribute boolean complete.8.3. • attribute boolean isMap. DOM INTERFACE . • attribute DOMString src. • attribute DOMString width. • }. • attribute DOMString height. • attribute unsigned long width. • NamedConstructor=Image(in unsigned long width.• [NamedConstructor=Image(). • attribute DOMString useMap. Embedded content. Text that conforms to the requirements given in the Contained By: • Content Model: • prose. Phrasing content. • attribute DOMString name. • attribute DOMString sandbox. • attribute unsigned long height. • }. Start tag: required End tag: required Categories: • • • Flow content. 4. Where embedded content is expected.3 The iframe element The iframe element introduces a new nested browsing context. in unsigned long height)] • interface HTMLImageElement : HTMLElement { • attribute DOMString alt. • NamedConstructor=Image(in unsigned long width). • attribute boolean seamless.

Model: ATTRIBUTES • Global attributes • • • • • src type width height Any other attribute that has no namespace (see prose).8. Contained By: • Content • Empty. Start tag: required End tag: required . • }. • attribute DOMString width. Embedded content. • attribute DOMString type. • attribute DOMString height. Phrasing content. Start tag: required End tag: empty Categories: • • • Flow content. [WINDOW] 4. DOM INTERFACE Depending on the type of content instantiated by the embed element.8.3.Objects implementing the HTMLIFrameElement interface must also implement the EmbeddingElement interface defined in the Window Object specification.3. will either be treated as an image. Where embedded content is expected.5 The object element The object element can represent an external resource. or as an external resource to be processed by a plugin. which. • interface HTMLEmbedElement : HTMLElement { • attribute DOMString src. the node may also support other interfaces. as a nested browsing context.4 The embed element The embed element represents an integration point for an external (typically nonHTML) application or interactive content. depending on the type of the resource. 4.

As a child of an object element. • attribute DOMString name. then. • attribute DOMString width. form-associated element. Contained By: • Content • .3. • readonly attribute HTMLFormElement form. Embedded content. Phrasing content. Start tag: required End tag: empty Categories: • None. • attribute DOMString height. • attribute DOMString useMap. Model: ATTRIBUTES • Global attributes • • • • • • • data type name usemap form width height • interface HTMLObjectElement : HTMLElement { • attribute DOMString data. • }. submittable.Categories: • • • • Flow content. Listed.8. 4. before any flow content. Empty. • attribute DOMString type. transparent.6 The param element The param element defines parameters for plugins invoked by object elements. Where embedded content is expected. the node may also support other interfaces. Contained By: • Content • Zero or more param elements. [WINDOW] Depending on the type of content instantiated by the object element. DOM INTERFACE Objects implementing the HTMLObjectElement interface must also implement the EmbeddingElement interface defined in the Window Object specification.

• readonly attribute unsigned long videoHeight. ATTRIBUTES • Global attributes • • • • • • • • src poster autobuffer autoplay loop controls width height • interface HTMLVideoElement : HTMLMediaElement { • attribute DOMString width. DOM INTERFACE . • Embedded content.Model: ATTRIBUTES • Global attributes • • name value • interface HTMLParamElement : HTMLElement { • attribute DOMString name.8. • If the element does not have a src attribute: one or more source elements. • Contained By: • Content Model: • Where embedded content is expected. • attribute DOMString value. transparent. • }. then. Start tag: required End tag: required Categories: Flow content. DOM INTERFACE 4. • Phrasing content. • attribute DOMString height. • readonly attribute unsigned long videoWidth. • attribute DOMString poster.3. If the element has a src attribute: transparent. • If the element has a controls attribute: Interactive content. • }.7 The video element A video element represents a video or movie.

Empty. If the element has a src attribute: transparent.3. before any flow content. then. Contained By: • Content Model: ATTRIBUTES • .8. Start tag: required End tag: empty Categories: • None.9 The source element The source element allows authors to specify multiple media resources for media elements. • If the element does not have a src attribute: one or more source elements.4. • Contained By: • Content Model: • Where embedded content is expected.8.3. • NamedConstructor=Audio(in DOMString src)] • interface HTMLAudioElement : HTMLMediaElement { • // no members • }. ATTRIBUTES • Global attributes • • • • • src autobuffer autoplay loop controls • [NamedConstructor=Audio(). • Embedded content. • If the element has a controls attribute: Interactive content. • Phrasing content. As a child of a media element.8 The audio element An audio element represents a sound or audio stream. Start tag: required End tag: required Categories: Flow content. DOM INTERFACE 4. transparent.

• }.10 The canvas element The canvas element represents a resolution-dependent bitmap canvas.8. DOM INTERFACE 4.• • • • Global attributes src type media • interface HTMLSourceElement : HTMLElement { • attribute DOMString src. Model: ATTRIBUTES • Global attributes • • width height • interface HTMLCanvasElement : HTMLElement { • attribute unsigned long width. Contained By: • Content • Transparent. [Variadic] in any args).8.3. • • Object getContext(in DOMString contextId). Start tag: required End tag: required Categories: • • • Flow content. • attribute unsigned long height. or other visual images on the fly. • attribute DOMString type. Start tag: required . DOM INTERFACE 4. • • DOMString toDataURL([Optional] in DOMString type. Embedded content.3. • attribute DOMString media. which can be used for rendering graphs. defines an image map. game graphics. • }. Phrasing content. Where embedded content is expected. in conjunction with any area element descendants.11 The map element The map element.

• }.3. Content • Empty. Where flow content is expected.12 The area element The area element represents either a hyperlink with some text and a corresponding area on an image map. but only if there is a map element ancestor. Start tag: required End tag: empty Categories: • • Flow content. Contained By: • Content • Flow content.End tag: required Categories: • Flow content. • readonly attribute HTMLCollection images. Model: ATTRIBUTES • Global attributes • name • interface HTMLMapElement : HTMLElement { • attribute DOMString name. Model: ATTRIBUTES • Global attributes • • • • • • • • • • alt coords shape href target ping rel media hreflang type DOM INTERFACE . • readonly attribute HTMLCollection areas. or a dead area on an image map. Phrasing content. DOM INTERFACE 4. Contained By: • Where phrasing content is expected.8.

• void deleteTFoot(). followed optionally by a tfoot element. • readonly attribute HTMLCollection tBodies. • attribute DOMString target. • attribute HTMLTableSectionElement tFoot. Where flow content is expected. • attribute DOMString media. followed by either zero or more colgroup elements.1 The table element The table element represents data with more than one dimension (a table). followed by either zero or more tbody elements or one or more tr elements. • HTMLElement createCaption(). .3. • HTMLElement createTHead(). • readonly attribute DOMTokenList relList. • HTMLElement createTFoot(). ATTRIBUTES • Global attributes DOM INTERFACE • interface HTMLTableElement : HTMLElement { • attribute HTMLTableCaptionElement caption.3.9 Tabular Data 4. • }. • readonly attribute HTMLCollection rows. • HTMLElement createTBody().9. • attribute DOMString ping.• interface HTMLAreaElement : HTMLElement { • attribute DOMString alt. • attribute DOMString hreflang. • void deleteTHead(). • void deleteCaption(). • attribute HTMLTableSectionElement tHead. • attribute DOMString rel. Start tag: required End tag: required Categories: • Flow content. • attribute DOMString shape. 4. • attribute DOMString coords. • attribute DOMString href. followed optionally by a tfoot element (but there can only be one tfoot element child in total). Contained By: • Content Model: • In this order: optionally a caption element. • attribute DOMString type. • HTMLElement insertRow([Optional] in long index). followed optionally by a thead element.

9. Contained By: • Content • Phrasing content.3. and tr elements. tfoot.3. Model: ATTRIBUTES • Global attributes • span • interface HTMLTableColElement : HTMLElement { • attribute unsigned long span. Contained By: • As a child of a table element.9. Content • Zero or more col elements. tbody. 4. 4. • }.4 The col element .3 The colgroup element The colgroup element represents a group of one or more columns in the table that is its parent.• void deleteRow(in long index). if it has a parent and that is a table element.3.2 The caption element The caption element represents the title of the table that is its parent. if it has a parent and that is a table element. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement. As the first element child of a table element. • }. after any caption elements and before any thead. Start tag: required End tag: required Categories: • None.9. Start tag: optional End tag: optional Categories: • None. DOM INTERFACE 4.

Start tag: optional End tag: optional Categories: • None. . same as for colgroup elements. and thead elements. • }. Model: ATTRIBUTES • Global attributes • span DOM INTERFACE HTMLTableColElement. if the tbody element has a parent and it is a table. Start tag: required End tag: empty Categories: • None. then the col element represents one or more columns in the column group represented by that colgroup. but only if there are no tr elements that are children of the table element. Contained By: • As a child of a colgroup element that doesn't have a span attribute. Contained By: • As a child of a table element. • void deleteRow(in long index). Content • Empty. This interface defines one member. Content • Zero or more tr elements Model: ATTRIBUTES • Global attributes DOM INTERFACE • interface HTMLTableSectionElement : HTMLElement { • readonly attribute HTMLCollection rows. span.9.If a col element has a parent and that is a colgroup element that itself has a parent that is a table element. colgroup.3. after any caption.5 The tbody element The tbody element represents a block of rows that consist of a body of data for the parent table element. • HTMLElement insertRow([Optional] in long index). • 4.

but only if there are no other tfoot elements that are children of the table element. Content • Zero or more tr elements Model: ATTRIBUTES • Global attributes DOM INTERFACE • HTMLTableSectionElement. 4.The HTMLTableSectionElement interface is also used for thead and tfoot elements. Contained By: • As a child of a table element. and tr elements. after any caption. thead. tbody. Start tag: optional End tag: optional Categories: • None.6 The thead element The thead element represents the block of rows that consist of the column labels (headers) for the parent table element. if the tfoot element has a parent and it is a table. colgroup.9. but only if there are no other thead elements that are children of the table element.3. • As a child of a table element.9. colgroup. but only if there are no other tfoot elements that are children of the table element. 4. after any caption. tfoot. if the thead element has a parent and it is a table.3. Start tag: optional End tag: optional Categories: • None. as defined for tbody elements.7 The tfoot element The tfoot element represents the block of rows that consist of the column summaries (footers) for the parent table element. and colgroup elements and before any tbody. Contained By: • As a child of a table element. and tr elements. and thead elements and before any tbody and tr elements. • Content Model: ATTRIBUTES Zero or more tr elements . after any caption.

9. As a child of a tr element. Model: ATTRIBUTES • Global attributes .3. Contained By: • Content • Flow content. colgroup. Start tag: required End tag: optional Categories: • None. 4. DOM INTERFACE as defined for tbody elements. • }. Start tag: required End tag: optional Categories: • Sectioning root.• • Global attributes HTMLTableSectionElement. 4.9 The td element The td element represents a data cell in a table.3. but only if there are no tbody elements that are children of the table element. Contained By: • As a child of a thead element. • readonly attribute long sectionRowIndex. • As a child of a tfoot element.9. • readonly attribute HTMLCollection cells. • As a child of a tbody element. after any caption. Content • Zero or more td or th elements Model: ATTRIBUTES • Global attributes DOM INTERFACE • interface HTMLTableRowElement : HTMLElement { • readonly attribute long rowIndex. and thead elements. • void deleteCell(in long index).8 The tr element The tr element represents a row of cells in a table. • HTMLElement insertCell([Optional] in long index). • As a child of a table element.

Start tag: required End tag: required Categories: • Flow content. As a child of a tr element. Contained By: • Content • Phrasing content.3.10 Forms 4. • }.10 The th element The th element represents a header cell in a table. Where flow content is expected. DOM INTERFACE 4.1 The form element The form element represents a collection of form-associated elements. but with no form element descendants. Model: ATTRIBUTES • Global attributes • • • • colspan rowspan headers scope • interface HTMLTableHeaderCellElement : HTMLTableCellElement { • attribute DOMString scope.3. some of which can represent editable values that can be submitted to a server for processing. Contained By: • Content Model: ATTRIBUTES • .3.10.• • • colspan rowspan headers • interface HTMLTableDataCellElement : HTMLTableCellElement {}. Flow content. DOM INTERFACE 4. Start tag: required End tag: optional Categories: • None.9.

• • readonly attribute HTMLFormControlsCollection elements. • • void dispatchFormInput(). DOM INTERFACE 4. • boolean checkValidity(). • attribute DOMString target. • • void submit(). • readonly attribute long length. Listed form-associated element. • void reset(). • attribute boolean novalidate. • [IndexGetter] any item(in DOMString name). Start tag: required End tag: required Categories: • • Flow content. Contained By: • Content Model: • .• • • • • • • • • Global attributes accept-charset action autocomplete enctype method name novalidate target • [Callable=namedItem] • interface HTMLFormElement : HTMLElement { • attribute DOMString acceptCharset.2 The fieldset element The fieldset element represents a set of form controls grouped under a common name. One legend element follwed by flow content. • }. • attribute DOMString enctype. • void dispatchFormChange(). • attribute DOMString name.3. • [NameGetter=OverrideBuiltins] any namedItem(in DOMString name). • attribute boolean autocomplete. • attribute DOMString action.10. • attribute DOMString method. Where flow content is expected.

but with no descendant labelable formassociated elements unless it is the element's labeled control. • readonly attribute HTMLFormElement form.ATTRIBUTES • Global attributes • • • disabled form name • interface HTMLFieldSetElement : HTMLElement { • attribute boolean disabled. Interactive content. • • readonly attribute DOMString type. • }. ATTRIBUTES • Global attributes • • form for • interface HTMLLabelElement : HTMLElement { • readonly attribute HTMLFormElement form. • boolean checkValidity(). Where phrasing content is expected.3 The label element The label represents a caption in a user interface. Contained By: • Content Model: • Phrasing content. • • readonly attribute HTMLFormControlsCollection elements. and no descendant label elements.3. Phrasing content. • attribute DOMString name. Form-associated element. DOM INTERFACE 4.10. • void setCustomValidity(in DOMString error). known as the label element’s labeled control. DOM INTERFACE . • readonly attribute DOMString validationMessage. The caption can be associated with a specific form control. • readonly attribute ValidityState validity. • • readonly attribute boolean willValidate. Start tag: required End tag: required Categories: • • • • Flow content.

• Listed. Model: ATTRIBUTES • Global attributes • • • • • • • • • • • • • • • • • • • • • accept action alt autocomplete autofocus checked disabled enctype form height list max maxlength method min multiple name novalidate pattern placeholder readonly . • Contained By: • Where phrasing content is expected.4 The input element The input element represents a typed data field. • Phrasing content. • readonly attribute HTMLElement control. Start tag: required End tag: empty Categories: Flow content.3. submittable. • If the type attribute is not in the Hidden state: Interactive content.• attribute DOMString htmlFor. Content • Empty. 4. labelable. • }. and resettable formassociated element. usually with a form control to allow the user to edit the data.10.

• attribute boolean noValidate. • readonly attribute HTMLFormElement form. • attribute DOMString enctype. • attribute DOMString target. • readonly attribute HTMLElement list. • attribute boolean disabled. • attribute DOMString src. • attribute boolean checked. • attribute DOMString max. • attribute boolean autofocus. • attribute DOMString action. • attribute Date valueAsDate. • attribute boolean multiple. • attribute DOMString min. • void stepDown(in long n). • attribute boolean autocomplete. • attribute DOMString placeholder. • attribute boolean indeterminate. • attribute DOMString defaultValue. • attribute DOMString value. • readonly attribute HTMLOptionElement selectedOption.• • • • • • • • required size src step target type value width • interface HTMLInputElement : HTMLElement { • attribute DOMString accept. • attribute DOMString height. • attribute DOMString type. • attribute DOMString step. • readonly attribute ValidityState validity. • attribute boolean readOnly. • attribute boolean required. • attribute boolean defaultChecked. • attribute unsigned long size. • • readonly attribute boolean willValidate. • attribute float valueAsNumber. • attribute DOMString width. • attribute DOMString pattern. • • void stepUp(in long n). DOM INTERFACE . • attribute DOMString alt. • attribute DOMString method. • attribute long maxLength. • attribute DOMString name.

Start tag: required End tag: required Categories: Flow content. • attribute unsigned long selectionStart. • void setCustomValidity(in DOMString error). • Interactive content. • Listed.3. • }. • attribute unsigned long selectionEnd. DOM INTERFACE . • Phrasing content. • attribute boolean autofocus. • • void select(). but there must be no interactive content descendant. labelable. • Contained By: • Content Model: • Where phrasing content is expected. then the user agent should allow the user to activate the button.• readonly attribute DOMString validationMessage. in unsigned long end). 4. • • readonly attribute NodeList labels. Phrasing content. • boolean checkValidity().5 The button element The button element represents a button.10. If the element is not disabled. and submittable form-associated element. • void setSelectionRange(in unsigned long start. ATTRIBUTES • Global attributes • • • • • • • • • • • action autofocus disabled enctype form method name novalidate target type value • interface HTMLButtonElement : HTMLElement { • attribute DOMString action.

• attribute DOMString value.10. • attribute DOMString name. • • readonly attribute NodeList labels. • boolean checkValidity(). • void setCustomValidity(in DOMString error). • Interactive content. 4. submittable. Model: ATTRIBUTES • Global attributes • • • • • • autofocus disabled form multiple name size • [Callable=namedItem] • interface HTMLSelectElement : HTMLElement { • attribute boolean autofocus. • readonly attribute HTMLFormElement form. • attribute DOMString type.• attribute boolean disabled.6 The select element The select element represents a control for selecting amongst a set of options. • attribute DOMString enctype. and resettable formassociated element. • attribute DOMString target. • attribute boolean disabled. • attribute DOMString noValidate. Start tag: required End tag: required Categories: Flow content. DOM INTERFACE . • Phrasing content. • • readonly attribute boolean willValidate. • readonly attribute DOMString validationMessage. • readonly attribute ValidityState validity. • }.3. Content • Zero or more option or optgroup elements. • Contained By: • Where phrasing content is expected. • Listed. labelable. • attribute DOMString method.

Phrasing content. • attribute DOMString value. • attribute boolean size. • void setCustomValidity(in DOMString error). The contents of the element represents fallback content for legacy user agents. Either: phrasing content. • • readonly attribute HTMLCollection selectedOptions. in HTMLElement before). • attribute unsigned long length. • [IndexGetter] any item(in DOMString name). • [NameGetter] any namedItem(in DOMString name). • • readonly attribute NodeList labels. along with its children. in long before). intermixed with option elements that represent the predefined options. • • readonly attribute boolean willValidate. • • readonly attribute HTMLOptionsCollection options.7 The datalist element The datalist element represents a set of option elements that represent predefined options for other controls. • void remove(in long index).10. • readonly attribute DOMString validationMessage. Or: Zero or more option elements. • void add(in HTMLElement element. • • readonly attribute DOMString type. • attribute long selectedIndex.• readonly attribute HTMLFormElement form. • boolean checkValidity(). Contained By: • Content Model: • • ATTRIBUTES • Global attributes DOM INTERFACE • interface HTMLDataListElement : HTMLElement { .3. should be hidden. • readonly attribute ValidityState validity. Start tag: required End tag: required Categories: • • Flow content. • attribute boolean multiple. Where phrasing content is expected. • void add(in HTMLElement element. In the rendering. the datalist element represents nothing and it. • attribute DOMString name. 4. • }.

Start tag: required End tag: optional Categories: • None. DOM INTERFACE 4. Contained By: • Content • Zero or more option elements. • }. Contained By: • • • Content • Text.3.3. As a child of a select element. As a child of a select element. • }.• readonly attribute HTMLCollection options. As a child of a datalist element.10. Start tag: required End tag: optional Categories: • None. 4.10. As a child of an optgroup element.8 The optgroup element The optgroup element represents a group of option elements with a common label. Model: ATTRIBUTES • Global attributes • • disabled label • interface HTMLOptGroupElement : HTMLElement { • attribute boolean disabled. • attribute DOMString label. Model: ATTRIBUTES • Global attributes • • • disabled label selected .9 The option element The option element represents an option in a select element or as part of a list of suggestions in a datalist element.

in boolean defaultSelected). in boolean defaultSelected.10. Content • Text. • attribute boolean defaultSelected.• value • [NamedConstructor=Option(). • attribute boolean selected. • Interactive content. • attribute DOMString label. • }. Start tag: required End tag: required Categories: Flow content. • Contained By: • Where phrasing content is expected. • NamedConstructor=Option(in DOMString text. Model: ATTRIBUTES • Global attributes • • • • • • autofocus cols disabled form maxlength name . DOM INTERFACE 4. and resettable formassociated element. • readonly attribute long index. in DOMString value). • attribute DOMString value. labelable. • NamedConstructor=Option(in DOMString text). • Phrasing content. in boolean selected)] • interface HTMLOptionElement : HTMLElement { • attribute boolean disabled.10 The textarea element The textarea element represents a multiline plain text edit control for the element’s raw value. • • readonly attribute DOMString text. submittable. • readonly attribute HTMLFormElement form.3. in DOMString value. The contents of the control represent the control’s default value. • NamedConstructor=Option(in DOMString text. • NamedConstructor=Option(in DOMString text. in DOMString value. • Listed.

• readonly attribute HTMLFormElement form. • • void select(). Listed and resettable form-associated element. • attribute DOMString wrap. • attribute DOMString defaultValue. Phrasing content. • attribute DOMString value. Where phrasing content is expected. • readonly attribute DOMString validationMessage. • }. • attribute boolean readOnly. in unsigned long end). DOM INTERFACE 4.• • • • readonly required rows wrap • interface HTMLTextAreaElement : HTMLElement { • attribute boolean autofocus. • attribute unsigned long cols. • attribute unsigned long selectionStart. • • readonly attribute NodeList labels. • void setSelectionRange(in unsigned long start. • readonly attribute ValidityState validity. • • readonly attribute DOMString type. • attribute unsigned long selectionEnd.3.10. • attribute boolean required. Contained By: • Content • . • attribute DOMString name. Start tag: required End tag: required Categories: • • • Flow content. Phrasing content. • attribute boolean disabled. • • readonly attribute boolean willValidate. • boolean checkValidity(). • void setCustomValidity(in DOMString error).11 The output element The output element represents the result of a calculation. • attribute unsigned long rows. • attribute long maxLength.

• attribute DOMString value. • void setCustomValidity(in DOMString error). DOM INTERFACE 4.11. Contained By: • Content • One legend element followed by flow content. • boolean checkValidity().11.3. • readonly attribute HTMLFormElement form. Interactive content.3. • • readonly attribute boolean willValidate. Where flow content is expected. Model: ATTRIBUTES • Global attributes • open • interface HTMLDetailsElement : HTMLElement { • attribute boolean open. • }.2 The command element .3. • }. • attribute DOMString name. • • readonly attribute DOMString type. • attribute DOMString defaultValue.1 The details element The details element represents additional information or controls which the user can obtain on demand. • readonly attribute ValidityState validity. • readonly attribute DOMString validationMessage.Model: ATTRIBUTES • Global attributes • • • for form name • interface HTMLOutputElement : HTMLElement { • attribute DOMString htmlFor. DOM INTERFACE 4.11 Interactive Elements 4. Start tag: required End tag: required Categories: • • Flow content.

• attribute DOMString radiogroup.click() • }. • attribute DOMString icon. Where phrasing content is expected. 4.The command element represents a command that the user can invoke. • attribute boolean default. • void click().3. DOM INTERFACE The Command interface must also be implemented by this element. Contained By: • • Content • Empty. Model: ATTRIBUTES • Global attributes • • • • • • • • type label icon disabled checked radiogroup default Also.11. Start tag: required End tag: empty Categories: • • • Metadata content.3 The bb element The bb element represents a user agent command that the user can invoke. Phrasing content. Flow content. // shadows HTMLElement. • attribute boolean checked. • attribute boolean disabled. the title attribute has special semantics on this element. Where metadata content is expected. • interface HTMLCommandElement : HTMLElement { • attribute DOMString type. • attribute DOMString label. Start tag: required End tag: required .

Phrasing content. but there must be no interactive content descendant. • If the element's type attribute is in the tool bar state: Interactive content. ATTRIBUTES • Global attributes • type • interface HTMLBrowserButtonElement : HTMLElement { • attribute DOMString type. Contained By: • Content Model: • Phrasing content. ATTRIBUTES • Global attributes • • type label • interface HTMLMenuElement : HTMLElement { • attribute DOMString type. • Contained By: • Content Model: • • Where flow content is expected. • }.Categories: • • • Flow content.12 Miscellaneous Elements . • attribute DOMString label. Where phrasing content is expected. • }. Either: Zero or more li elements. 4. Interactive content. DOM INTERFACE 4.4 The menu element The menu element represents a list of commands. DOM INTERFACE The Command interface must also be implemented by this element.3. Start tag: required End tag: required Categories: Flow content. • readonly attribute boolean supported. Or: Flow content.3. • readonly attribute boolean disabled.11.

• }. • As a child of a figure element. Content • Phrasing content. Start tag: required End tag: required Categories: • Flow content.12. Where flow content is expected. lang/xml:lang. and title attributes to mark up semantics common to a group of consecutive elements.3. Start tag: required End tag: required Categories: • None. Model: ATTRIBUTES • Global attributes DOM INTERFACE • interface HTMLLegendElement : HTMLElement { • readonly attribute HTMLFormElement form.2 The div element The div element represents nothing at all. Model: ATTRIBUTES • Global attributes DOM INTERFACE • Uses HTMLElement.12. if there are no other legend element children of that element. Contained By: • Content • Flow content. Contained By: • As the first child of a fieldset element. • As the first child of a details element. 4. It can be used with the class. 5 Index of Elements 5.1 Conforming Elements .1 The legend element The legend element represents a title or explanatory caption for the rest of the contents of the legend element’s parent element.4.3.

Element a abbr address area article aside audio b base bb bdo blockquote body br button canvas caption cite code col colgroup command datagrid datalist dd del details dfn dialog div dl Start End Tag Short Description Tag required required Hyperlink required required Abbreviation required required Contact information required empty Image map region required required Independent section required required Auxiliary section required required Audio stream required required Bold text required empty Document base URI Bi-directional text override required required Browser button required required Notes required required Long quotation optional optional Main content required empty Line break required required Push button control required required Bitmap canvas required required Table caption required required Citation required required Code fragment required empty Table column Command that a user can invoke Interactive tree. list or tabular data Predefined control values Description description required optional Table column group required empty required required required required required optional required required Deletion required required Additional information required required Defining instance of a term required required Conversation required required Generic division required required Description list .

required required Form control group required required Notes required required Section footer required required Form required required Heading level 1 required required Heading level 2 required required Heading level 3 required required Heading level 4 required required Heading level 5 required required Heading level 6 optional optional Document head required required Section header required empty Separator optional optional Document root required required Italic text required required Inline frame required empty required empty Image Form control The heading level is also affected by sectioning elements required required Insertion required required User input required required Form control label required required Explanatory title or caption Link to resources Marked or highlighted text Metadata required optional List item required empty required required Client-side image map required required required required Command menu required empty required required Scalar measurement .Element dt em embed fieldset figure footer form h1 h2 h3 h4 h5 h6 head header hr html i iframe img input ins kbd label legend li link map mark menu meta meter Start End Tag Short Description Tag required optional Description term required required Stress emphasis required empty Embedded application A figure with a caption.

Element nav noscript object ol optgroup option output p param pre progress q rp rt ruby samp script section select small source span strong style sub sup table tbody td textarea tfoot th thead Start End Tag Short Description Tag required required Navigation required required required required Alternative content for no script support Generic embedded resource Notes required required Ordered list required optional Option group required optional Selection choice required required Output control required optional Paragraph required empty Plugin parameter required required Preformatted text required required Progress of a task required required Inline quotation required required Ruby parenthesis required required Ruby text required required Ruby annotation required required Sample output required required Linked or embedded script required required Document section required required Selection control required required Small print required empty required required Media resource Generic inline container required required Strong importance required required Embedded stylesheet required required Subscript required required Superscript required required Table optional optional Table body required optional Table cell required required Multi-line text control optional optional Table footer required optional Table header cell optional optional Table head .

Use a form with a text input and submit button. Consider using CSS layouts or the iframe element. This list may be incomplete.2 Obsolete Elements These elements are obsolete and should not be used by authors. Use a semantically appropriate element with CSS for style. Use CSS instead. Use the ul element.Element time title tr ul var video Start End Tag Short Description Tag required required Date and/or time required required Document title required optional Table row required required Unordered list required required Variable required required Video or movie Notes 5. Preformatted Use the pre element. along with notes about conforming alternatives that may be used instead. However. they are documented here because they are supported by browsers. This has limited support in browsers. Use a semantically appropriate element with CSS for style. Element acronym applet basefont bgsound big Start Short End Tag Notes Tag Description Use the abbr element required required Acronym required required Java applet required empty required empty required required required required required required required required required required Font style required required required required required required required required Base font style Use the object element. Consider using CSS layouts or the iframe element. Use the audio element. text blink center dir font frame frameset isindex listing . Please report any missing elements. CSS provides an alternative with limited browser support. Use a semantically appropriate element with CSS for style. but note that blinking text is annoying.

text Consider using the del element. or another semantically appropriate element with CSS for style. required required required required required required required required required required Preformatted Use the pre element. text s required required required required required required spacer strike tt required required Teletype u wbr xmp required required required empty required required 5. or another semantically appropriate element with CSS for style.0 5 strict yes Hyperlink strict strict strict transitional strict yes yes yes yes yes yes Abbreviation Acronym Contact information Java applet Image map region Independent section Auxiliary section Audio stream . or another semantically appropriate element with CSS for style. Consider using the code element. Use CSS layout techniques. if appropriate. Use a semantically appropriate element with CSS for style.3 Comparison of HTML 4. Preformatted Use the pre element. Consider using the del element.01/XHTML HTML Short Description 1.Element marquee nobr noembed noframes plaintext Start Tag End Tag Short Description Notes Scripting or CSS animations can be used to simulate scrolling text.01 and HTML 5 Elements Element a abbr acronym address applet area article aside audio HTML 4. Use a semantically appropriate element with CSS for style. if appropriate. if appropriate.

list or tabular data Predefined control values Description description Deletion Additional information Defining instance of a term Conversation Long quotation Main content Line break Push button control Bitmap canvas Table caption Document base URI Base font style Browser button Bi-directional text override .0 5 strict yes Bold text strict transitional strict strict strict strict strict strict strict transitional strict strict strict strict strict strict strict transitional strict strict strict strict strict transitional yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes Generic division Description list Description term Stress emphasis Embedded application Form control group A figure with a caption. Font style Citation Code fragment Table column Table column group Command that a user can invoke Interactive tree.Element b base basefont bb bdo bgsound big blink blockquote body br button canvas caption center cite code col colgroup command datagrid datalist dd del details dfn dialog dir div dl dt em embed fieldset figure font HTML 4.01/XHTML HTML Short Description 1.

Element footer form frame frameset h1 h2 h3 h4 h5 h6 head header hr html i iframe img input ins isindex kbd label legend li link listing map mark marquee menu meta meter nav nobr noembed noframes HTML 4.0 strict frameset frameset strict strict strict strict strict strict strict strict strict strict transitional strict strict strict transitional strict strict strict strict strict strict transitional strict frameset HTML Short Description 5 yes Section footer yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes Command menu Metadata Scalar measurement Navigation User input Form control label Explanatory title or caption List item Link to resources Preformatted text Client-side image map Marked or highlighted text Heading level 1 Heading level 2 Heading level 3 Heading level 4 Heading level 5 Heading level 6 Document head Section header Separator Document root Italic text Inline frame Image Form control Insertion Form .01/XHTML 1.

01/XHTML 1.Element noscript object ol optgroup option output p param plaintext pre progress q rp rt ruby s samp script section select small source spacer span strike strong style sub sup table tbody td textarea tfoot th HTML 4.0 strict strict strict strict strict strict strict strict strict transitional strict strict strict strict strict transitional strict strict strict strict strict strict strict strict strict strict HTML 5 yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes yes Short Description Alternative content for no script support Generic embedded resource Ordered list Option group Selection choice Output control Paragraph Plugin parameter Preformatted text Preformatted text Progress of a task Inline quotation Ruby parenthesis Ruby text Ruby annotation Sample output Linked or embedded script Document section Selection control Small print Media resource Generic inline container Strong importance Embedded stylesheet Subscript Superscript Table Table body Table cell Multi-line text control Table footer Table header cell .

Where HTML and XHTML differ.1 Conventions To ease readability and improve understanding. 6.1. this document uses a number of conventions.1 Notes. [Need to provide examples of these] 6. 6.Element thead time title tr u ul var video wbr xmp HTML 4. Warnings are used to point out common authoring errors and highlight important issues to be aware of.01/XHTML HTML Short Description 1.0 5 strict yes Table head strict strict transitional strict strict yes yes yes yes yes yes Preformatted text Unordered list Variable Video or movie Date and/or time Document title Table row 6 How to Read This Guide This section needs major revision and may be dropped. Tips and Warnings Notes are used throughout this document to provide additional information. separate examples are given with each one clearly labelled.2 Example Markup Example markup is provided for both HTML and XHTML. Tips are used to provide useful hints and suggestions. but in others there may be differences syntactic differences. </body> . HTML Example: <!DOCTYPE html> <html lang="en"> <head> <title>HTML Example</title> </head> <body> <p>This is a sample HTML document. In some cases.1. the markup is the same and thus only one example is needed.

XHTML Example: <img src="image. however. HTML Example: <img src="image. due to the XML Well-Formedness requirements.1. void elements are always marked up using the trailing slash.png" alt="example"/> In HTML. HTML Example: <input type="checkbox" checked> XHTML Example: <input type="checkbox" checked="checked"/> 6.</html> XHTML Example: <html xmlns="http://www.2. all attribute values in examples are quoted using double quotes. boolean attributes are written in their minimised form and in XHTML examples. Erroneous Example: <p>This markup contains a <em><strong>mistake</em></strong></p> 6. they are written in expanded form. bad practices and other issues to be cautious of.png" alt="example"> 6.</p> </body> </html> Sometimes. unless explicitly stated otherwise. is always omitted.2.w3.2 Void Elements In XHTML examples.1.3 Namespaces .2. erroneous examples are included.org/1999/xhtml" xml:lang="en"> <head> <title>XHTML Example</title> </head> <body> <p>This is a sample XHTML document.1. This is usually done to illustrate common authoring errors.1 Attributes Unless explicitly stated otherwise for a specific purpose. In HTML examples. the trailing slash is optional and.

w3..Some XHTML examples make use of XML namespaces.w3. xml html math svg http://www.w3. In such cases.w3.org/1998/Math/MathML http://www.org/1999/xhtml http://www. </html> XHTML Example: <div> <svg:svg><svg:circle r="50" cx="50" cy="50" fill="green"/></svg:svg> </div> . the following prefixes are assumed to be defined even if there is no xmlns attributes in the fragment of code.org/2000/svg XHTML Example: <html xml:lang="en"> ..org/XML/1998/namespace http://www.