HTML Tags
16 May 2020 | HTML
Each HTML tag has a special meaning for the browser. HTML tags Help the browser to format and display content, a web browser can recognize between HTML content and simple content. HTML tags contain three main parts: an opening tag, content, and a closing tag. But some HTML tags are non-closed tags. You can use as many tags as you like according to your code requirement.
Note: -
All tags are predefined so you can't create your own tags.
ALL HTML tag is always written in lowercase.
Each HTML tags must be enclosed in <> these brackets.
Each tag in HTML performs different tasks.
If you have used an open tag <tag>, you must use a closing tag </tag> (except some tags).
HTML contains two types of tags
- Paired Tags
- Unpaired Tags
Paired Tags -
Paired tags come in pairs and It must have an opening and closing tag.
Example of paired Tags are:
<html> </html>
<table> </table>
<form> </form>
<span> </span>
<p> </p>
Unpaired Tags -
The unpaired tag does not include a closing tag. These open just like paired tags but don't need to close.
Example of unpaired Tags:
<br>
<hr>
<meta>
<input>
HTML Heading Tag
It is possible to give an appropriate size of headings in a document with the help of heading tags. There are six different HTML heading tags. You can use different sizes for your headings that are defined by the <h1> to <h6> tags. use <h1> for the largest heading and <h6> for the smallest one. <h1> can be used for most important headings and <h6> can be used for the least important one.
Note:- Web browsers will be automatically adding some white space (a margin) before and after a heading.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML Paragraph Tag Example </title>
</head>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
This will produce the following result -
This is Heading 1
This is Heading 2
This is Heading 3
This is Heading 4
This is Heading 5
This is Heading 6
HTML Paragraph Tag
The <p> tag is used to define a paragraph in a document. The HTML <p> tag or the HTML paragraph tag defines a paragraph. you can use it to write a text or paragraph.
Note:- Web browsers will be automatically adding some white space (a margin) before and after a paragraph.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML Paragraph Tag Example </title>
</head>
<body>
<p> This is First Paragraph </p>
<p> This is Second Paragraph </p>
<p> This is Third Paragraph </p>
</body>
</html>
This will produce the following result -
This is the First Paragraph
This is the Second Paragraph
This is the Third Paragraph
HTML Anchor Tag
The HTML link is defined with the <a> tag (anchor tag). It is used to create a hyperlink or link to any other file, web page, image, etc. Anything between opening the <a> tag and closing </a> becomes part of the link, and a user can click on that part to access the linked document.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML Anchor Tag Example</title>
</head>
<body>
<a href="https://www.buildwithphp.com/"> This is a link </a>
</body>
</html>
This will produce the following result -
HTML Image Tag.
The <img> Image Tag is used to It is used to insert an image within an HTML document. The 'src' attribute is used to give the source(address) of the image anything written as a value of this attribute will be displayed.
You can use the width="px" and height="px" attributes to control the height and width of the image.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML Image Tag Example </title>
</head>
<body>
<img src="image-name.jpg" width="500px" height="250px">
</body>
</html>
This will produce the following result -
Upload Image here...
HTML Line Break Tag
The <br> tag inserts a single line break that means Every time you use the <br> element, then the rest part starts from the next line. This tag is an example of an empty item, where there is no need to open and close tags as there is nothing between them.
Note:- Use the <br> tag to enter line breaks, do not use it to separate paragraphs.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML br Tag Example </title>
</head>
<body>
<p>Hello<br>
This is the example<br>
of<br>
line break</p>
</body>
</html>
This will produce the following result -
Hello
This is the example
of
line break
Buddy! I hope you relished the tutorial, and it was good to see you again. Keep learning. Keep visiting.
