Crus4

logo
Menu
crus4
Menu

Html Elements

Previous
HTML Elements

HTML Elements

All HTML Documents are made up of HTML elements. An HTML element is everything written between the start tag and an end tag:

<Start tag> Element content here </End tag>

In the below example, the body element includes the <h1> tags, <p> tags and the main content: “This is first heading” & “This is a paragraph”.

Example

<body>
  <h1> This is first heading </h1>
  <p> This is a paragraph </p> 
</body>
Start tagElement contentEnd tag
<body><h1> This is first heading </h1>
<p>This is a paragraph</p>		</body>
<h1>This is first heading </h1>
<p>This is a paragraph</p>
Example Explained

Nested HTML Elements

HTML documents consist of nested HTML elements, this means that elements can contain other elements. In an example below, there are five HTML elements ( <html>, <head>, <body>, <p> and <h1>)

Example
<html>
 <head>
 </head> 
  <body>
   <h1> First heading </h1>
   <p> First paragraph </p> 
  </body> 
<html>

Explanation

<html> element defines the whole HTML document. It has a start tag <html> and an end tag </html>.

Inside an <html> element there is a <head> element.

<head> element contains all the non-visual elements that helps to make the page work. You can read in depth article about <head> element here.

Then, inside an <head> element there is a <body> element.

<body> 

<h1> first heading </h1.
<p> first paragraph </p> 
</body>

<body element has a start tag <body> and an end tag </body>. Between these two tags we can add the main content of our web page, and yes we can also say that <body> element defines the document’s body.

Here, inside the <body> element we have two other elements; <h1> and <p>. 

<h1> First heading </h1>
<p> First paragraph </p>

The element <h1> defines a heading. it has a start tag <h1> and an end tag </h1>.

The element <p> defines a paragraph. It has a start tag <p> and an end tag </p>.

Can we Skip the End Tag

Some HTML elements will display correctly, even if didn’t put an end tag(closing tag). However, sometimes unexpected results and errors may occur.

Some HTML elements like <br/> (which is used to break the line as shown in the below example) did not have end tags.

Example

<p> This is a paragraph </p> 
<p> This is also <br/> a paragraph </p>
Output
This is a paragraph
This is also
a paragraph
Output

As you can see here the <br/> tag breaks the line.

Next

Related Posts

Basics of HTML

Text Formatting and Attributes

HTML Elements – crus4

Related Posts: