WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

HTML Elements


HTML documents are defined by HTML elements.


HTML Elements

* The opening tag is often called the opening tag, and the ending tag is often called the closing tag.

<tagname>content</tagname>

The HTML element is everything from the begin tag to the end tag:

<p>My first HTML paragraph.</p> <p>MY FIRST HTML PARARAGRAPH.</p>
Start tag Element content End tag
<h1> My First Heading </h1>
<p> My first paragraph. </p>
<br> break    

Nested HTML Elements

The above example contains three HTML elements.

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>
Try it yourself »

HTML Example Explained

This element has a start tag <p> and an end tag <p>. The element content is: This is the first paragraph.
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

The <body> component characterizes the document body.

It has a start tag <body> and a end tag </body>.

The component content is two other HTML components (<h1> and <p>).

<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>

The <h1> component characterizes a heading.

It has a start tag <h1> and an end tag </h1>.

The component content is: My First Heading.

<h1>My First Heading</h1>

The <p> component characterizes a paragraph.

It has a start tag <p> and an end tag </p>.

The component content is: My first paragraph.

<p>My first paragraph.</p>

Don't Forget the End Tag

Even if you forget to use the closing tag, most browsers display HTML correctly:

Example

<html>
<body>

<p>This is a paragraph
<p>This is a paragraph

</body>
</html>
Try it yourself »

The above examples also display normally in the browser, because closing the tab is optional.

But do n’t rely on it. Forgetting to use end tags can produce unpredictable results or errors.


Empty HTML Elements


HTML elements without content are called empty elements. Empty elements are closed in the opening tag.

<br> Is the empty element without the closing tag(<br> Labels define line breaks).

In XHTML, XML, and future versions of HTML, all elements must be closed.

Add slashes in the start tag, such as <br />, Is the correct way to close empty elements, and HTML, XHTML, and XML all accept it.

Even if <br> Works in all browsers, but using <br /> In fact, it is a longer-term guarantee.

HTML Tip: Use Lowercase Tags

HTML tags are not case sensitive: <P> is equivalent to <p>.

The novice tutorial uses lowercase tags because the World Wide Web Consortium (W3C) recommends to use lowercase in HTML 4, and mandatory in future (X) HTML lower case.