HTML Elements

An HTML element is an individual component of an HTML document.

HTML Element Syntax

HTML Elements represent semantics, or meaning. For example, The title element represents the title of the document. Most HTML elements are written with a start tag (or opening tag) and an end tag (or closing tag), with the content in between.

Elements can also contain attributes that define additional properties of an element. For example, a paragraph, which is represented by the p element, would be written as:

HTML Element Syntax Illustration

We will learn about attributes in next chapter.

Note: All elements don't require the end tag to be present. These are referred as empty elements, self-closing elements or void elements. Learn more.

HTML Tags Vs Elements

Technically, an HTML element is the collection of start tag, its attributes, an end tag and everything in between. On the other hand an HTML tag either opening or closing is used to mark the start or end of an element.

However, in common usage the terms HTML element and HTML tag are interchangeable i.e. a tag is an element is a tag. For simplicity's sake of this website, the terms "tag" and "element" are used to mean the same thing — as it will define something on your web page.

Case Insensitivity in HTML Tags and Attributes

In HTML, tag and attribute names are not case-sensitive. It means the tag <P>, and the tag <p> defines the same thing in HTML which is a paragraph.

But in XHTML they are case-sensitive and the tag <P> is different from the tag <p>.

Tip: We recommend using lowercase for tag and attributing names in HTML, since by doing this you can make your document more compliant for future upgrades.

Empty HTML Elements

Empty elements (also called self-closing or void elements) are not container tags — that means, you can not write <hr>some content</hr> or <br>some content</br>.

A typical example of an empty element, is the <br> element, which represents a line break.

<p>This paragraph contains <br> a line break.</p>

Note: In HTML, a self-closing element is written simply as <br>. In XHTML, a self-closing element requires a space and a trailing slash, such as <br />.

Nested HTML Elements

Most HTML elements can contain any number of further elements, which are, in turn, made up of tags, attributes, and content or other elements.

The following example shows two elements: <em> element nested inside <p> element.

<p class="example">Here is some <em>emphasized</em> text.</p>

HTML Elements Types

Elements can be placed in two distinct groups: block level and inline level elements. The former make up the document's structure, while the latter dress up the contents of a block.


Your Feedback:

We would love to hear from you, please drop us a line.