HTML (Hyper Text Markup Language) is the most widely used markup language in existence. HTML is the primary markup language used to build websites. It was born out of SGML and XML in the early nineties. HTML is used to semantically define the structure of a document.
Basic HTML Structure
HTML is written using a nested structure of tags. When the web page is loaded the browser interprets the tags and renders the document.
Below is an example of a basic HTML document.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>Formatting tags in html :
What is the body tag?
The body tag is a container element that holds the contents of the site. Anything you potentially want visible to the user will go inside the body tag.
What is the head tag?
The head tag is a container that holds metadata about the document. Metadata is information that describes other data. For example, the author or created date associated with this blog post would be considered metadata. The information we place in the head tag is not visible to the user. The data in the head tag can be used by the browser to set the document title, character set, styles, scripts, author, keywords'
title Tag
The title tag sets the title of the document. The title is displayed in the browser tab.
meta Tag
The meta tag allows you to add metadata about a document. The data is not visible to the user but used by browsers and search engines. The browser may use the data to determine content about the site such as character set and viewport. You can also target search engines by using the meta tag to add keywords to the site.
link Tag
The link tag is used to tell the browser the relationship between the current document and an external resource. In most cases, the external resource is a stylesheet. Another common use case is to specify the favicon of the document which is the icon of the site. To link an external resource (i.e. stylesheet), we supply the link tag with a couple of attributes.
Formatting tags:
Html contains several formatting tags for test formatting list are below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>formating tags</title>
</head>
<body>
<h1>formating tags demo</h1>
<image src="https://qph.cf2.quoracdn.net/main-qimg-953adb64071e441bcf54bbe71c9d9b60-pjlq"
alt="formating tags image"/>
<p><b>bold</b></p>
<p><strong>bold</strong><!--strong and b are same for bold but it is different for search engine--></p>
<p><br/>break space line </p>
<p><i>it is for italic</i></p>
<p> <em>italic</em><!--i and em both are same but for search engine it is different--></p>
<p> <strike>mobile</strike><!--no more in use--></p>
<p>h<sub>2</sub>o</p>
<p>(a+b)<sup>2</sup></p>
<p><del>text delete</del></p>
<p><ins>added</ins></p>
<p><big>big text</big><!--no more in use--></p>
<p><small>small text</small></p>
<p><pre>
roses are red
voilets are blue
yada yada
</pre><!--in this tag exactly how you work it will come same automaticaly ex.
poems qootes etc--></p>
<p><code>/*hi i m khushnoor my code/*@#kc$</code></p>
<p>first html page <a href= "./html/classes/first.html">link</a></p>
<p>my first html page<a href="./html/classes/khushi.html">link</a></p>
</body>
</html>
These are the tags we write in vscode for making a web page by using html concept, output is shown in below you can easily make an web page using all these tags it is intresting you must try.
bold
bold
break space line
it is for italic
italic
mobile
h2o
(a+b)2
text delete
added
big text
small text
roses are red
voilets are blue
yada yada
/*hi i m khushnoor my code/*@#kc$
first html page link
conclusion:
we have learn about basic html tags and struscture till now further in next article we learn more things hope you enjoy this short journey.