Introduction to HTML The image tag, anchor tag and the button tag The division tag Ordered and Unordered Lists in HTML Tables in HTML HTML Forms

Introduction to HTML

HTML is a web styling language which allows us to make webpages by including various elements like plain text,buttons,hyperlinks,images,videos and much more.In HTML,we use tags to display various forms of media and information.In this HTML series,we are going to learn about these tags from scratch.

What is a tag?

In HTML,every information is displayed using tags.Each tag starts with an < tag_name and then >.Most of the HTML tags need to have a closing tag as well. To close a tag,we use < /(forward slash) tag_name and then > The opening and the closing tag defines the boundaries of an HTML element. The information present within the enclosing tags will be rendered on the web page. Every html document starts with < !DOCTYPE html >tag. This is to tell the browser that the document is writen in html.After that,we use the HTML tag to start our HTML document like this: 

<!DOCTYPE html>
<html lang="en">
</html>
Here,lang="en" means that the language of the webpage is English.It makes it easier for the browsers and search engines to display the information.Every other tag must be enclosed with the <html> tag

The <head> tag

The head tag includes the meta tags,title tags and the link tags. The meta tag is used to describe the page,specify the character set or to specify the viewport information.The viwport is used to make the page responsive for other screen sizes.The title tag is used to define the title of the webpage. The link tag is used to link external stylesheets. We define the head tag as follows: 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
</html>
The title is displayed at the top left.

The <body> tag

The main content of a webpage is enclosed within the body tag. It contains all the other tags to show content on the web page. 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
This is the body of my first HTML page.
</body>
</html>

The heading tags

The heading tags are used to display the information in a larger font size. It is used to display headings in order to gain user attention.The heading tags are <h1> <h2>,<h3>.... till <h6>.The <h1> tag has the largest font size,<h2> tag has second largest font size and so on.<h6> tag has the smallest font size. the heading tags must have a closing tag. The below code shows how these tags are used. 
 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<h1>This is an h1 tag.</h1>
<h2>This is an h2 tag.</h2>
<h3>This is an h3 tag.</h3>
<h4>This is an h4 tag.</h4>
<h5>This is an h5 tag.</h5>
<h6>This is an h6 tag.</h6>
</body>
</html>

The paragraph tag

The paragraph tag is used to display large information in a paragraph format. 
                
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<p>
Hello everyone! My name is Elite Akshay and I'm passionate about teaching coding and engineering subjectsto help people build a strong foundation in these fields.
My goal is to share the wealth of knowledge with others and help people to develop skills by which they canearn money. Here I'll be breaking down complex concepts
into easy-to-understand pieces to help you learn and practice what you've learned.
</p>
</body>
</html>
Here,is your first HTML page ready.