HTML - SPLessons

HTML Elements

Chapter 8

SPLessons 5 Steps, 3 Clicks
5 Steps - 3 Clicks

HTML Elements

HTML Elements

shape Introduction

This chapter demonstrate about the HTML Elements which are the basic building blocks of the web page and are identified by the web browser. Following are the concepts covered.

  • What are HTML Elements
  • Types of Elements

What are HTML Elements

shape Description

Html elements are the basic building blocks of the web document and which are predefined to the user. Html elements have the overall control of the web document.

HTML elements are not used for designing purpose, Cascading style sheets (CSS) can be used for designing purpose which is an evolving technology in HTML.

Types of Elements

shape Description

Various types of elements are available in HTML in order to build a web page, following are few elements.

Empty Elements
Empty Elements are known as the Tags without content which means, user need not to put any content between the elements and these are also validated in Html Eg: <code> </code>, <div> </div>. The below code demonstrate the empty elements in HTML.

 
<!DOCTYPE HTML>                        
<html>  
	I  <code> </code> like splessons.
</html>                                   

Result
By running the above code in a preferred browser user can get the following output as shown in below image.

Self Closing Elements
The Single tag is known as the Self Closing Elements, the Start and End tags are combined together by using the Stroke Character ( / ) which is placed at end of the single tag. Eg: <code/>, <br/>. The below code demonstrate the self closing elements in HTML.

<!DOCTYPE HTML>                        
<html>  
 	splessons tutorial <br/>. 
</html>                                     

Result
By running the above code in a preferred browser user can get the following output as shown in below image.

Void Elements
Void elements also represents in a single tag, but do not allows the content with in the elements.
Void elements are of two types first one is the only starting tag like <hr> and the second one is the tag with stroke like <hr/>. The below code demonstrate the void elements in HTML.

<!DOCTYPE HTML>                        
<html>
	<style>
		p{font-family:Arial;}
	</style>  
		<p>splessons Tutorials</p>
	<hr>
	<p>Html</p>
</html>                                      

Result
By running the above code in a preferred browser user can get the following output as shown in below image.

Doctype
<!DOCTYPE> is the first tag of the every HTML document which is recommended by World Wide Web Consortium (W3C). By using doctype browser can encode the document and process the file in browsers standard models. The below code demonstrate the doctype in HTML.

<!DOCTYPE HTML>                        
<html>  
 	<p> splessons - Html.</p>
</html>                              

Result
By running the above code in a preferred browser user can get the following output as shown in below image.

Summary

shape Key Points

  • HTML elements are case sensitive.
  • HTML Elements can be nested.
  • Some elements work fine without defining the end tags.