The HTML document is defined by a number of HTML elements.
An HTML element usually contains a start tag and an end tag, the content is included in the middle of the tag.For example, here is a typical HTML element:
<p>Hello，My first paragraph.</p>| Start tag | element content | end tag |
|---|---|---|
| <p> | This is a paragraph | </p> |
| <a href=”default.htm”> | Here’s a link | </a> |
| <br> |
An HTML element with no content is called an empty element. Empty element is closed in the start tag. <br> is an empty element that does not has close tag.
HTML element syntax
- The HTML element starts with the start tag.
- The HTML element ends with an end tag.
- The content of the element is between the start tag and the end tag.
- Some HTML elements have empty content.
- The empty element is closed in the start tag.
- Most HTML elements can have attributes.
Note: You will learn more about the attributes in the next chapter of this tutorial.
HTML document example
<!DOCTYPE html>
<html>
<body>
<p>This is the first paragraph.</p>
</body>
</html>The above example contains three HTML elements.
The <p> Element:
<p>This is the first paragraph.</p>This <p> element defines a paragraph in the HTML document.
This element has a start tag <p> and an end tag </ p>.
The content of the element is: This is the first paragraph.
The <body> element:
<body>
<p>This is the first paragraph.</p>
</body>The <body> element defines the body of the HTML document.
This element has a start tag <body> and an end tag </ body>.
The element content is another HTML element (<p> element).
The <html> element:
<html>
<body>
<p>This is the first paragraph.</p>
</body>
</html>The <html> element defines the entire HTML document.
This element has a start tag <html>, and an end tag </ html>.
The element content is another HTML element (<body> element).
Do not forget to use the end tag
Even if you forget to use the end tag, most browsers display HTML correctly:
<p> This is a paragraph
<p> This is a paragraphThe above example is also displayed correctly in the browser, because close tag is optional.
But try not to adopt this approach. Forgetting the end tag can have unpredictable results or errors.
HTML empty element
An HTML element with no content is called an empty element. Empty element is closed in the start tag. <br> is an empty element that does not has close tag.
In XHTML, XML, and future versions of HTML, all elements must be closed.
Adding a slash to the start tag, such as <br />, is the correct way to turn off the empty element, which HTML, XHTML, and XML both accept.
Even though <br> is valid in all browsers, using <br /> is actually a longer term safeguard.
Common empty elements are: <hr />, <input />, <img />, <link />, <meta />, etc.
HTML tags are case insensitive:<P> is equivalent to <p>.
Many websites use uppercase HTML tags. However, the W3C recommends using lowercase in HTML 4 and the future (X) HTML version.
