HTML – TAGS and ELEMENTS

HTML tags helps us to define structure of webpage, stylise texts, insert graphics (Images, videos) and set hyperlinks.

HTML TAGS

Tags helps us to inform browser to stylise text as per the tag. To bold a text, there is a tag, to insert image, there is another tag, to insert video, there is another tag. There are lots of predefined tags, using which we can achieve a desired result.

EXAMPLE:

Suppose we want to bold a text. To bold text, we need to use bold tag- ‘<b></b>’

The less than symbol and greater symbol wrapped around b tells browser, begin the bold of the text from here. Commonly it is known as open bold tag. And less than symbol, then forward slash, then b and then greater than symbol, tells browser to end the bold here. Commonly it is known close bold tag. Every tag has open tag and close tag. In between these tags, text is rendered accordingly.

How do you recognise a tag is open tag?

Open tag does not contain a forward slash.

How do you recognise a tag is close tag?

Close tag does contain a forward slash.

Do every tag begins with open tag and ends with close tag?

No. Yes all tags begin with open tag. But all tags dont end with close tag. There are certain tags which dont require close tag. (We are going to discuss about such tags in another chapter). Other wise most of the tags end with close tag.

ASSIGNMENT:

<html>

<head>

<title>This is a sample webpage</title>

<meta name=”content” description=”this is a sample webpage for practice purpose.”/>

</head>

<body>

This is a sample webpage. This webpage is for practice purpose. I have successfully developed the webpage.

</body>

</html>

Open a text editor, type exact above text. Save it as ‘demo.html’ and locate the file. Right click on it and open in any browser. You would see result as below.

HTML WEBPAGE

Now lets stylise the ‘sample webpage’ text as bold.

How can we set text as bold using bold tag in a HTML Webpage?

<body>

This is a <b>sample webpage. This webpage is for practice purpose. I have successfully developed the webpage.

</body>

<body>

This is a <b>sample webpage</b>. This webpage is for practice purpose. I have successfully developed the webpage.

</body>

Bold tag example HTML Webpages

Now go ahead, and experiment yourself. Try to bold entire text. And also try to bold each text individually.

Practice as much as you can.

What are elements in a webpage?

When we set tags around text or texts, we refer it as wrapping. We have wrapped a text or texts with tag. A text or texts wrapped around with tags is known as element. Here in the above example we have ‘sample webpage’ text element.

If some one asks you how to you set bold to elements, then your answer should be, to set bold to elements, we use bold tag.