HTML Elements | basic html tags

HTML Elements


The HTML elements are usually consist of a start tag and end tag, with contents inserted in between:
<tagname>Content goes here...</tagname>
The HTML elements is everything from the start tag to the end tag:
<p>My first paragraph.</p>
Start tagElement contentEnd tag
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<br>  
The HTML elements with no contents called empty elements. The Empty element do not have any end tag, such as the <br> element (which indicates a line break).

Nested HTML Elements

HTML elements are can be nested (elements can contain elements).
All HTML documents consist of nested HTML elements.
This example contains four HTML elements:

Example

<!DOCTYPE html>
<html>
<body>

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

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

Example Explained

The <html> element defines the whole document.
It has  starting tag <html> and an end tag </html>.
The element content is another HTML element (the <body> element).
<html>
<body>

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

</body>
</html>
The <body> element defines the document body.
It has  start tag <body> and an end tag </body>.
The element content is two other HTML elements is (<h1> and <p>).
<body>

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

</body>
The <h1> element defines a heading.
It has  start tag <h1> and an end tag </h1>.
The element content is: My First Heading.
<h1>My First Heading</h1>
The <p> element defines a paragraph.
It has  start tag <p> and an end tag </p>.
The element content is: My first paragraph.
<p>My first paragraph.</p>


Do Not Forget the End Tag

Some HTML elements will display correctly, even if you forget to the end tag:

Example

<html>
<body>

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

</body>
</html>
Try it Yourself »
The example above work in all browsers, because the closing tag is considered optional.
Never rely on this. It might produce unexpected result and/or error  if you forget the end tag.

Empty HTML Elements

The HTML elements with no contents are called empty elements.
<br> is an empty element without any closing tag (the <br> tag defines a line break):

Example

<p>This is a <br> paragraph with a line break.</p>
Try it Yourself »
Empty element can be -closed with the opening tag like  <br />.
HTML5 does not require empty any elements to be closed. But if you want to stricter validation, or if you need to make your document readable by XML parsers, you must close all HTML elements properly.

Use Lowercase Tags

HTML tags are not case sensitive like c: <P> means the same as <p>.
HTML5 standards do not require lowercases tags, but W3C recommends lowercase in HTML, and demandslowercase for stricter document types like XHTML.
At W3Schools we always use lowercase tags.

No comments:

Post a Comment