HTML

HTML Tags

HTML tags are used to format the web page content. The web browsers can identify the html content with the help of these tags. There are opening and closing tags. Some content may not have closing tags. The opening tag, closing tag, attributes and content combined together make an html element. So the tags are a part of html elements. The html tags are enclosed between < and >. Void elements are those which does not allow content e.g. br, hr, img. The void elements in html should not have the end tag. They should have only start tag. Tag names in start and end tags to identify the element. The attributes are optional. One or more attributes can be given to the tags. The content should be between start and end tags. The following are some of the popular tags in html.
Some of the html tags
<html> tag defines the root of html document
<head> tag has metadata information of html document
<body> tag defines the body of html document
<div> tag defines section of html document
<h1> to <h6> defines headings of html document
<a> defines hyperlink
<button> defines button to click
<map> defines an image map.

Example1:

<!DOCTYPE html>
<html lang=”en-US”>
<head>
<title>This is the title</title>
</head>
<body>
This is the body
<h1 style=”color:Red;font-family:Arial”>This is header1</h1>
<h2>Header2</h2>
<h3>Header3</h3>
<h4>Header4</h4>
<h5>Header5</h5>
<h6>Header6</h6>
<p>Para</p>
<!–
Comment1
Comment1
–>
<i>Italics</i>
<b>bold</b>
<strong>strong</strong>
<mark>Highlighted</mark>
<em>emphasize</em>
<img src=”C:\Test\Logo.jpg” alt=”Logo”>
</body>
</html>

Example2:

<!DOCTYPE html>
<html>
<head>
<title>HTML Formatting</title>
</head>
<body>
<p>
This is line 1<br>
This is line 2<br>
This is line 3<br>
</p>
<u>This is underlined text</u><br>
<i>This is italicised text</i><br>
<small>This is small text</small><br>
<del>This is deleted text</del><br>
<ins>This is inserted text</ins><br>
This <del>are</del><ins>is</ins> deteled/inserted example<br>
This is subscripted text H<sub>2</sub>O<br>
This is superscript text 1<sup>st</sup>Jan<br>
<em>This is emphasized text</em><br>
<strong>This is strong text</strong><br>
<b>This is bold text</b><br>
<mark>This is highlighted text</mark><br>
<p>Next is blockquote:</p>
<blockquote cite=”https://www.microsoft.com/en-in/”>Quoting from Microsoft</blockquote>
<q>Double quotes</q><br>
<abbr title=”Hyper text markup language”>HTML</abbr><br>
<p>address is used for conctact info for document or part of it</p>
<addr>
<a href=”https://wordpress.org/”>wordpress</a>,
<a href=”https://www.microsoft.com/en-in/”>Microsoft</a>
</addr>
</body>
</html>

Example3:

The code that lies between <!– and –> is commented code. This can be removed to test this part of code

<!DOCTYPE html>
<html>
<head>
<title>Learn about head tag</title>
<!–<base href=”https://www.microsoft.com/en-in/” target=”_blank”>–>
<meta charset=”utf-8″> <!–can handle any language–>
<meta name=”description” content=”Online html course”>
<!–meta name=”keywords” is ignored by search engine because of spam–>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
<!–
<script>alert(“Please enter your email:”)</script>
<meta http-equiv=”refresh” content=1> refresh the content every 1 seconds–>
</head>
<body>
<h1>Heading 1</h1><br>
<h2>Heading 2</h2><br>
Lesson on head tag<br>
<a href=”/about”>About</a>
</body>
</html>