HTML Elements.

What is a HTML element? Well, a HTML element is made up of, and consists of an opening tag, the element content and a closing tag.

If you are unfamiliar with HTML tags take a look at our tags tutorial.

HTML elements are what makes up a HTML page, or a webpage. Let's take a look at an example of an element.

<p> This is a paragraph element </p>

HTML element break down:

<p> - This is the opening tag.

'This is a paragraph - The element content.

</p> - The closing tag.

All elements must be closed using a closing tag. Some elements, known as empty elements need to be closed using a different method though.

Empty elements.

Empty elements are elements that, as the name suggests, hold no content.

These elements still need to be closed, but we can simply close them in the starting tag.

Some examples:

<img src="images/image1.gif" />

<br />

The above elements have been closed by adding a slash to the starting tag.

You may find that you can actually leave the slash out in some browsers but it is considered bad practice.

Adding the slash is the best way to close an empty tag & by following this method you are future-proofing your code.

Nesting elements

Elements can be nested within other elements. This is obviously very useful. Below is a simple example explaining the use of nested elements.

Lets say you would like to place a paragraph in your html document. Inside that paragraph you would like certain words to be bold.

HTML code:

<p> This is a paragraph.<b> This is some bold text inside the paragraph </b> </p>

When nesting elements always remember to close the inner element before closing the outer one.