Elements

An HTML element is a piece of content in an HTML document.

Syntax

<opening-tag> content </closing-tag>

<self-closing-element />

Most elements are made of opening and closing tags but some are self-closing. Furthermore, some self-closing elements like <br> can have a slash at the end like so: <br />.

Nested Elements

HTML elements can be nested, which means that elements can contain other elements inside them, or nested. All HTML documents consist of nested HTML elements.

The following example contains four HTML elements: <html>, <body>, <h1>, and <p>:

<!DOCTYPE >
<html>
<body>
<h1>Blog Post</h1>
<p>My first paragraph.</p>
</body>
</html>

Elements

<a>
Creates a link to another page or to a location in the current page.
<abbr>
Indicates an acronym or abbreviation of a longer word or phrase.
<acronym>
Creates text that will be displayed when hovered over.
<applet>
Used to embed Java applets in HTML documents but is no longer supported.
<audio>
Represents an interface for adding audio content to the page.
<b>
Used to draw attention to a section of text, usually rendered in boldface.
<basefont>
Used to be used to set the font of text. This is now deprecated.
<blink>
Used to make text flash on and off and is now obsolete, deprecated, and non-standard.
<blockquote>
Represents a section of a document which contains a longer quotation, usually spanning multiple lines.
<br>
Represents a break in text. It is used when text needs to span multiple lines rather than being in-line, such as in an address.
<button>
Represents a button meant to be clicked by the user.
<canvas>
Creates graphics and animations in the page for JavaScript and WebGL to interact with
<center>
Displays its contents centered horizontally in the containing element. This is now deprecated and CSS should be used instead.
<cite>
Represents a citation to a referenced work such as a book, a song, or a painting.
<code>
Represents source code contained in the text.
<dd>
Describes details found inside a <dl> element. It usually comes with at least one corresponding <dt> term tag.
<div>
Represents a generic division of content. It has no semantic meaning, but will separate its contents from the rest of the document.
<dl>
Displays terms and details, commonly for metadata purposes.
<dt>
Describes a term found inside a <dl> tag. It usually comes with at least one corresponding <dd> details tag.
<em>
Represents text which is emphasized. Browsers will show the enclosed text in italics, by default."
<embed>
Inserts external content such as a video, image, page, and more.
<font>
Used to be used to set the font characteristics of a text. This is now deprecated.
<form>
Represents an interface to collect and submit user supplied information. This can include open ended text inputs, radio buttons, calendar information, and more.
<h1> - <h6>
Represents a text heading for a section of content, with <h1> being the highest level of heading and <h6> being the lowest.
<head>
Represents a collection of metadata related to the current document. It is an immediate child of the `<html>` element and may include other tags such as <title>, <link>, <style>, and <script>.
<hr>
Represents a semantic, horizontal line break between text elements.
<html>
Represents the entire HTML document.
<i>
Used to set off HTML text for some reason, as idiomatic, technical, taxonomical and so on. Typically rendered as italic.
<iframe>
Represents a container used to embed a second web page inside the current one. It can be used for content from the same domain as the parent, or even from a second domain.
<img>
Displays an image on the web page.
<input>
Creates an interactive element, usually used within a form to allow user input. It can be used to make text boxes, color pickers, date pickers, and other UI elements.
<kbd>
Emphasizes characters to look like keys on a keyboard.
<li>
Represents a single item in a list of items. It and the other list items must be wrapped in an <ol>, <ul>, or <menu> tag.
<link>
Connects the current page with an external file.
<menu>
Represents an unordered list of items with more semantic meaning than a regular ul element.
<meta>
Represents an interface to provide metadata pertaining to the document. Metadata is data that is used to describe the document that contains it.
<noscript>
Displays content within if Javascript is disabled in the browser or not supported.
<object>
Represents an external resource such as an image, a nested browsing context, or content to be handled by a browser plugin.
<ol>
Represents an ordered list of items.
<option>
Represents one option in a dropdown created by the select tag.
<output>
Displays the result of a calculation or user action.
<param>
Used to pass parameters to a resource defined in an object tag.
<picture>
Represents multiple possible image sources to be applied to different devices and screen-sizes.
<q>
Used to represent a brief inline quotation.
<script>
Used to insert runnable code into a document, usually JavaScript. Can be used both to include a script within the HTML document, or to load an external script from another source.
<select>
Creates a drop-down list for the user to select from a number of option elements.
<source>
Represents an interface for adding source content to the page.
<span>
Used for grouping related text or elements for styling and scripting.
<strong>
Used to identify text that is very important, or urgent.
<table>
Represents an interface for adding tabular data to the page. Tables are two dimensional, made up of rows and columns, and can contain many types of content.
<u>
Used to display HTML text with a non-textual annotation. The default rendering of this is a solid underline.
<ul>
Represents an unordered list of items.
<video>
Represents an interface for adding video content to the page.

Contributors

Interested in helping build Docs? Read the Contribution Guide or share your thoughts in this feedback form.

Learn HTML on Codecademy