Below is a list of the tags (or elements) supported in HTML5. This list is generally based on the W3C HTML5 specification, but may also include elements that are only in the WHATWG HTML Living Standard. For an explanation of the differences between the WHATWG and the W3C versions of HTML,
Many tag also are in the html4 and earlier specification which is why the new html5 tags have been identified. HTML5 syntax rules are broadly documented at the bottom of the document
| Tag | Description | New in HTML5? |
|---|---|---|
| <!–…–> | Specifies a comment | |
| <!DOCTYPE> | Specifies the document type | |
| <a> | Specifies a hyperlink | |
| <abbr> | Specifies an abbreviation | |
| <address> | Specifies an address element | |
| <area> | Specifies an area inside an image map | |
| <article> | Specifies an article |
New
|
| <aside> | Specifies content aside from the page content |
New
|
| <audio> | Specifies sound content |
New
|
| <b> | Specifies bold text | |
| <base> | Specifies a base URL for all the links in a page | |
| <bdi> | For bi-directional text formatting |
New
|
| <bdo> | Specifies the direction of text display | |
| <blockquote> | Specifies a long quotation | |
| <body> | Specifies the body element | |
| <br> | Inserts a single line break | |
| <button> | Specifies a push button | |
| <canvas> | Define graphics |
New
|
| <caption> | Specifies a table caption | |
| <cite> | Specifies a citation | |
| <code> | Specifies computer code text | |
| <col> | Specifies attributes for table columns | |
| <colgroup> | Specifies groups of table columns | |
| <data> | Allows for machine-readable data to be provided |
New
|
| <datalist> | Specifies an “autocomplete” dropdown list |
New
|
| <dd> | Specifies a definition description | |
| <del> | Specifies deleted text | |
| <details> | Specifies details of an element |
New
|
| <dfn> | Defines a definition term | |
| <dialog> | Specifies that part of an application is interactive. | |
| <div> | Specifies a section in a document | |
| <dl> | Specifies a definition list | |
| <dt> | Specifies a definition term | |
| <em> | Specifies emphasized text | |
| <embed> | Specifies external application or interactive content |
New
|
| <fieldset> | Specifies a fieldset | |
| <figcaption> | Specifies caption for the figure element. |
New
|
| <figure> | Specifies a group of media content, and their caption |
New
|
| <footer> | Specifies a footer for a section or page |
New
|
| <form> | Specifies a form | |
| <h1> | Specifies a heading level 1 | |
| <h2> | Specifies a heading level 2 | |
| <h3> | Specifies a heading level 3 | |
| <h4> | Specifies a heading level 4 | |
| <h5> | Specifies a heading level 5 | |
| <h6> | Specifies a heading level 6 | |
| <head> | Specifies information about the document | |
| <header> | Specifies a group of introductory or navigational aids, including hgroup elements |
New
|
| <hgroup> | Specifies a header for a section or page.NOTE: This element has been dropped from W3C HTML5 spec but it is still included in WHATWG Living Standard. |
New
|
| <hr> | Specifies a horizontal rule | |
| <html> | Specifies an html document | |
| <i> | Specifies italic text | |
| <iframe> | Specifies an inline sub window (frame) | |
| <img> | Specifies an image | |
| <input> | Specifies an input field | |
| <ins> | Specifies inserted text | |
| <kbd> | Specifies keyboard text | |
| <keygen> | Generates a key pair |
New
|
| <label> | Specifies a label for a form control | |
| <legend> | Specifies a title in a fieldset | |
| <li> | Specifies a list item | |
| <link> | Specifies a resource reference | |
| <main> | Specifies the main content area of an HTML document. |
New
|
| <map> | Specifies an image map | |
| <mark> | Specifies marked text |
New
|
| <menu> | Specifies a menu list |
HTML 5.1
|
| <menuitem> | Specifies a command that a user can invoke from a popup menu. |
HTML 5.1
|
| <meta> | Specifies meta information | |
| <meter> | Specifies measurement within a predefined range |
New
|
| <nav> | Specifies navigation links |
New
|
| <noscript> | Specifies a noscript section | |
| <object> | Specifies an embedded object | |
| <ol> | Specifies an ordered list | |
| <optgroup> | Specifies an option group | |
| <option> | Specifies an option in a drop-down list | |
| <output> | Specifies some types of output |
New
|
| <p> | Specifies a paragraph | |
| <param> | Specifies a parameter for an object | |
| <pre> | Specifies preformatted text | |
| <progress> | Specifies progress of a task of any kind |
New
|
| <q> | Specifies a short quotation | |
| <rb> | Marks the base text component of a ruby annotation. |
New
|
| <rp> | Used for the benefit of browsers that don’t support ruby annotations |
New
|
| <rt> | Specifies the ruby text component of a ruby annotation. |
New
|
| <rtc> | Marks a ruby text container for ruby text components in a ruby annotation. |
New
|
| <ruby> | Specifies a ruby annotation (used in East Asian typography) |
New
|
| <s> | Indicates text that’s no longer accurate or relevant. | |
| <samp> | Specifies sample computer code | |
| <script> | Specifies a script | |
| <section> | Specifies a section |
New
|
| <select> | Specifies a selectable list | |
| <small> | Specifies small text | |
| <source> | Specifies media resources |
New
|
| <span> | Specifies a section in a document | |
| <strong> | Specifies strong text | |
| <style> | Specifies a style definition | |
| <sub> | Specifies subscripted text | |
| <summary> | Specifies a summary / caption for the <details> element |
New
|
| <sup> | Specifies superscripted text | |
| <table> | Specifies a table | |
| <tbody> | Specifies a table body | |
| <td> | Specifies a table cell | |
| <template> | Declares HTML fragments that can be cloned and inserted in the document by script. |
New
|
| <textarea> | Specifies a text area | |
| <tfoot> | Specifies a table footer | |
| <th> | Specifies a table header | |
| <thead> | Specifies a table header | |
| <time> | Specifies a date/time |
New
|
| <title> | Specifies the document title | |
| <tr> | Specifies a table row | |
| <track> | Specifies a text track for media such as video and audio |
New
|
| <u> | Specifies text with a non-textual annotation. | |
| <ul> | Specifies an unordered list | |
| <var> | Specifies a variable | |
| <video> | Specifies a video |
New
|
| <wbr> | Specifies a line break opportunity for very long words and strings of text with no spaces. |
New
|
SRC: http://www.quackit.com/html_5/tags/
HTML5 Syntax or coding rule
Closing your tags
Generally all of these HTML elements have opening and closing tags, and that the content of the element is placed in between them. The closing tag is slightly different to the opening tag – the closing tag contains a forward slash (/) after the <. This tells the browser that this tag closes the previous one.
There are a few exceptions to this rule such as the <br> tag which for best practise should be self closing and should be written as <br/>.
Tag Order
When you nest tags/html elements you must nest them completely in that the first one opened should be the last one closed. as per the example below:
<header>
<h1>
<span> my header
</span>
</h1>
</header>
NOT
<header>
<h1>
<span> my header
</h1>
</span>
</header>
Indenting your hand written code
Indentation has no bearing on how the page is rendered, but it has a huge effect on the readability of the code. Standard procedure is to indent one tab (or a few spaces) when you are starting a new element that is a child element of the tag above it. Then move back in a tab when you are closing that element.
UPPERCASE or lowercase?
You can use uppercase or lowercase when coding HTML5, however, most developers use lowercase. This helps the readability of your code, and it also saves you from constantly switching between upper and lower case.
Click here to download a printable version of this html5 table
update:Self-Closing Elements
Common selfclosing elements include
<br /><embed.../><hr /><img /><input../><link../><meta../><param../><source../>
You must be logged in to post a comment.