In this article we will learn some basic tags and uses of them. Also if you have no knowledge about html or its tags don't worry this series will get you covered this series will up of 30 parts . Hence you must have understood that i will divide html tags into 15 parts and rest 15 parts will be on css also known as Cascading StyleSheet which is used to design a page in html. So lets get started.
Some basic tags with explanation
<!DOCTYPE> - This tage is used to give the browser which type of document is it it is most commonly used in html as <!DOCTYPE html> it should be used in the starting of the html file ther are several types of documents like html , xhtml, html 4, etc using <!DOCTYPE html> advises the browser that this is a html5 document and load is as an html5 webpage.
<html> - This is the main tag where the html file starts from and ends with a </html> in the end of file.
<head> - This is is a container for metadata (data about data) and is placed between the <html> tag and the <body> tag. Metadata is not displayed. Metadata typically define the document title, character set, styles, scripts, and other meta information. it ends with an </head>
<title> - By its name you could have understood that it will define the title of the webpage . Here title doesnot means that it will display the title in the webpage it will assign a title to the tab of the browser in which it is open. This tag is used in between <head> and </head> tag
<body>- It is also a container which contains all the main contents that are going to be displayed on a webpage. As usual it ends with </body> tag.
<h>- It is a tag place within body tag to display a heading in a webpage . There are 7 types of <h> tag :
<h1>- It is used to display an large sized text<h2>- It also displays large text but smallet than <h1><h3>- It also displays large text but smallet than <h2><h4>- It also displays large text but smallet than <h3><h5>- it is used for displaying a small text<h6>- It used for displaying a smaller text
<p> - It is used to display paragraphs and ends with a matching </p> tag.
<img> - It is used to display an image on a html page either through a link or by its folder on the local server . To give the link or path of image src is used .Below are both examples
Using path of file in local machine :
<img class="lazyload" data-src="path to file"></img>
Using Link to an image:
<img class="lazyload" data-src="https://imagefilelink.com/image.jpg"></img>
Some examples of above metioned tags
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<img src="image.jpg"></img>
</body>
</html>Example of head tag:
<!DOCTYPE html>
<html>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
</body>
</html>
Examples of p tag:
<!DOCTYPE html>
<html>
<head>
<title>My First HTML</title>
</head>
<body>
<p>The HTML head file and i am using p tag
to display paragraph.</p>
</body>
</html>
Example of img tag:
<!DOCTYPE html>
<html>
<body>
<h2>HTML Images</h2>
<p>HTML images are defined with the img tag:</p>
<img src="image.jpg">
</body>
</html>
