| <!--...--> |
A comment tag, anything written in here is invisible to the browser. Can only be viewed in the source code, often used for notes and instructions. |
N/A |
Container |
| <!DOCTYPE> |
This tag tells the browser what version of HTML you are using. It is required at the beginning of any HTML document. For older versions, it could be quite tricky to figure out, but for HTML5, you can just use "html". |
N/A |
Empty |
| <a> |
The anchor tag is used for links to other pages. Inside the tag, you also include an href property to point the browser to the right page. |
Inline |
Container |
| <article> |
The article tag is used to contain the main content of a page, to distinguish it from all the window dressing. It contains semantic value as well as logical, telling the browser and other software that this is the real meat of the page. |
Block |
Container |
| <aside> |
The aside tag is used for information related to, but not directly part of, the content around it. |
Block |
Container |
| <body> |
The body tag contains ALL content of a page. Including any headers and footers, asides, links, etc. It generally defines the visible content of a page |
Block |
Container |
| <br /> |
The line break tag inserts a line break, as you'd expect from the name. |
Inline |
Empty |
| <dd> |
This tag indicates a description in a description list, paired with the <dt> tag, within a <dl> tag. |
Block |
Container |
| <div> |
A generic tag for dividing sections of content. Contains no specific semantic value, but can be defined with tags. Largely deprecated by more complex organizational tags in HTML5. |
Block |
Container |
| <dl> |
Defines a description list, with pairs of terms and definitions, indicated by <dt> and <dd> tags, respectively. |
Block |
Container |
| <dt> |
This tag contains a term within a description list, paired with a <dd> tag. |
Block |
Container |
| <em> |
The emphasis tag emphasizes text. Appears as italics in most browsers, but also carries semantic value which can be read by outside programs. |
Inline |
Container |
| <fieldset> |
This tag defines a series of related elements in a form. It also draws a box around those elements, by default. |
Block |
Container |
| <figcaption> |
Sets the caption for a figure, as defined by a <figure> tag. |
Block |
Container |
| <figure> |
Defines a set-apart piece of content for a page. Usually an image or a table, which can be paired with a caption explaining what it is. |
Block |
Container |
| <footer> |
The footer tag defines content that goes at the end of a page. Typically this includes rote information like authorship, copyrights, and so on. |
Block |
Container |
| <form> |
The form tag defines an area for user feedback. It can contain many different kinds of input, from text boxes to buttons to sliders. |
Block |
Container |
| <h1> to <h6> |
The various header tags, each one creates a smaller heading than the last. Rather than simply sizing text, they also contain important semantic value, and can be used to organize a page. h1 is the largest, and most important, while h6 is the smallest, and least important. |
Block |
Container |
| <head> |
The head tag contains all of the setup information for a website. This includes some visible elements, like the title, but also many invisible ones, like css styles to apply, character sets to load, and so on. |
Block |
Container |
| <header> |
This is a container tag for heading information/elements for a page. It is all visible, and serves primarily as a semantic tool for indicating introductory information. Things like authorship for an article, company logos, etc. |
Block |
Container |
| <html> |
The HTML tag contains all the HTML code of an HTML document. It should encompass the entire file, excepty for the document type declaration. |
Block |
Container |
| <iframe> |
The inline frame is used to embed an outside document within a webpage. Typically a PDF or a file from an online file storage site, like googledocs. |
Block |
Container |
| <img /> |
An image tag inserts an image into a page. This image is linked within the tag as a property. |
Block |
Empty |
| <input> |
A tag that defines a field where the user can input feedback for a website. Typically placed within a field, it can take many different forms depending on the properties of the tag. |
Block |
Empty |
| <label> |
The label tag sets the label for a button or other input on a form. |
Block |
Container |
| <li> |
This is the list item tag, which contains an item within a list tag. |
Block |
Container |
| <link /> |
A link tag contains a link to an external resource, typically a cascading CSS style sheet. It is usually placed in the head of a page, not visible to the user. |
N/A |
Empty |
| <meta /> |
The meta tag contains metadata, or data about data. It is not displayed on the page, and contains miscellaneous background information, like when the page was last modified, a page description, and so on. They are machine-parsable, and often used by search engine web crawlers. |
N/A |
Empty |
| <nav> |
The navigation tag is a semantic organizational tag used to indicate navigational areas for a site. It typically contains links to other parts of the site, or other related sites. |
Block |
Container |
| <ol> |
A tag for creating an ordered list. Your typical list of several items stacked on top of one another, each item defined by a list item tag. |
Block |
Container |
| <p> |
The paragraph tag defines a paragraph of text. |
Block |
Container |
| <script> |
The script tag is used to set off user-side scripts. It contains either the script itself, or elements linking to an external script, which is then executed by the user's browser. |
Block |
Container |
| <section> |
A tag for creating a section of a document. A chapter, a table of contents, etc. |
Block |
Container |
| <strong> |
This tag strongly emphasizes text. It is typically rendered as bolding the text by the browser, but contains semantic value that can be picked up by other programs. |
Inline |
Container |
| <style> |
The style tag is placed in the head and contains styling information for the page. Typically, a CSS document is linked instead, but for very small tweaks to styles it may be used on a per-page basis. |
Block |
Container |
| <table> |
This tag defines a table. It may contain many other elements defining rows and columns, and their content, like this very table I'm writing in! |
Block |
Container |
| <td> |
This tag defines a normal cell of a table. As opposed to a header cell, a regular cell has text that is standard style and aligned to the left. |
Block |
Container |
| <th> |
This tag is used to define a header cell of a table. The text in this cell will be bolded and center-aligned. Typically placed at the very top! |
Block |
Container |
| <title> |
The title tag defines the title of a document, which is displayed in the title bar of a browser. It is required for all HTML documents, and is placed in the head. |
N/A |
Container |
| <tr> |
A tag that defines a new row of a table in HTML. It will contain several cells and their contents. |
Block |
Container |
| <ul> |
This defines an unordered list. It will be displayed with bullets instead of numbers. Contains list items. |
Block |
Container |