HTML Tags Tutorial

Any HTML document we see must have tags. For example, look at the following document, here <html>, <head>, </head>, <body> etc. tags.


Simply put, a word wrapped with less than (<) and greater than (>) signs (which HTML allows) is called a tag. For example, when we wrap the word HTML with these two symbols in an HTML document, it is called an HTML tag. There are hundreds of such tags in HTML. Like paragraph tag <p></p>, heading <h1></h1> tag etc.


<!DOCTYPE html>
<html>
<head>
<title>HTML Tag tutorial in CodesBright</title>
</head>
<body>

<h1>CodesBright demo heading</h1>

<p>demo content goes here.</p>

</body>
</html>


The technical term used is that the opening tag is called the opening tag or start tag, and the end tag is called the closing tag or end tag. Both are the same, except that the closing tag has an extra backslash (/) symbol. Should place content inside these opening and closing tags. As given in the above example.


This tag is the main thing in HTML. There are hundreds of tags. The more you can remember, the faster you can work. But after working for a long time, most of the necessary tags are memorized.


Some tags have no closing tag, like input tag, image tag, etc. These tags are slightly different.


<img src="/path/to/image.jpg" alt="an_image"/>
<input type="submit" value="Save"/>


Note that image tags start with <img like this and end with /> symbols. So is the input tag. And the things you see in between (src, type, etc.) are attributes of the corresponding tag.


Different types of attributes can be used in each tag. Attribute Tutorial


Each tag has a specific function, for example, if you want to put a paragraph in your HTML document, put it inside the <p></p> tag, if you want to put a heading, put it inside the <h1></h1> tag (if you have a large font heading, use <h1 >, size up to <h6>). Input tag to give text field, <img tag to give image, <title></title> tag to show in title bar of browser etc.


In the above document, <html></html> is called the parent tag for the entire document because all the tags in the whole document are placed inside it. Tags used inside are its child tags. Similarly, the child tag of the head tag is the title tag, but the title tag has no child tag. Again see the body is the parent tag and its child tags are p and h1 here