Skip to main content

What are HTML Tags

Image
By
HTML tags are the instructions that are directly embedded in the HTML document. An HTML tags is the backbone of web browser and that the Html tags are must the responsible to show the website without them there would be no website. 
 
 
what are HTML Tags

 
 
This tag is used to what kind of web technologies are using in the website like PHP, Python, JavaScript…etc. .Html tag helps to find the script to show the page on the internet. without these tags, there are no websites and internet. 
 

 

What are HTML Tags? 

 
Html tags are pre-defined elements in HTML, we can't create new and the tags are enclosed within these angle brackets < > less than and greater than. The angle brackets between the tag must be used to define the element in HTML. 
 
For example : <html> , <div>, <script>

All these tags are having a particular work and special function Example: <i> tag is defined as italic on the website, and <b> this for bold, <table> tag displays a table in the website.

There are two types of HTML tags: 
 
  • paired tags
  • unpaired tags

Paired tags 

 
Paired tags are the tag that consists of placed between a tag and its companion tag. In paired tags are starting with an opening tag < > that tag name enclosed with inside the angle brackets . Example: <strong> and opening tag which as ends with a closing tag followed by a slash. Example: closing tag </strong>. 
 
And unordered list is is defined as <ul> used to bullet list opening tag <ul> and closing tag </ul>. 
 

Example: 


  <strong>dailyaspirants.com</strong>


  <i>is a openingtag.<b> is a closing tag.

Output: 

dailyaspirants.com

 

List of few paired tags: 

 
opening tag closing tag
<html> </html>
<head> </head>
<body> </body>
<form> </form>
<div> </div>
<table> </table>
<span> </span>
<style> </style>
<pre> </pre>
<code> </code>
<td> </td>
<ul> </ul>

 

Unpaired Tags


unpaired tags are single tag or stand-alone tag which does not have a closing tag. These tags are otherwise called singular tags and are also called non-container tags. 
 
This tag does not have any content and we can't. But this tag is also a powerful tag in HTML. so, the unpaired tag is closed after adding a slash (/) before the sign of greater than > 
 

For example: 

 
<br/>,<hr/> 
 
<br/> tag is a line-break in text.It is an empty tag. 
 
<hr/> tag is a horizontal rule and it is used to divide or a separate document. It is also an empty tag. 
 

Few Unpaired tags are:


Opening tag:
<br>
<hr>
<meta>
<link>
<input>


Some Examples with Html tags 

 

HTML Image Tag 

 
HTML Image tag is used to add the images in the html websites or documents .Html image tag is and 'src' is the attributes to give the path of the image location. using to control by the attributes image is width and height in 'px'. 
 
And some time image will not shown on website for some reasons that time used alternative case called 'alt'. The 'alt' is used to add what kind of image and given information about the image. 

<!DOCTYPE html>
<html>
<head>
<title>HTML Image Tag</title>
</head>
<body>
<img src="htmltag.jpg" width="500" height="500px" alt="HTML tags"> 
</body>
</html>

Output: 

 

HTML paragraph Tag 

 
Paragraph are represented as <p> html element tag and closing end tag with </p> gives the text inside it. It is show display the text in the website. 

<!DOCTYPE html>
<html>
<head>
<title> HTML Paragraph Tag </title>
</head> 
<body> 
<p>First Paragraph </p>
<p>Second Paragraph </p> 
<p>Third Paragraph </p> 
</body> 
</html>

output: 


First Paragraph
Second Paragraph
Third Paragraph

Html Anchor Tag 

 
HTML Anchor Tag is defined as <a> tag and closed tag </a> .Here, It is used to give a link to a webpage, image, and redirect to a particular location link. 

  <!DOCTYPE html> 
<HTML>  
<head> 
<title> HTML Anchor Tag </title> 
</head> 
<body>  
<a target="_blank" href="https://dailyaspirants.com"> Click Here to Redirect To </a> 
</body>  
</html>
  

Click Here to Redirect To



Read also:  Rowspan and Colspan in HTML

Read also: How to create Multiple tables in one page in HTML

Labels:

Comments

Post a Comment

Popular posts from this blog

Contact Management System project using C with source code

By
Contact Management System (CMS)   A Contact Management System (CMS) is an essential application for organizing and managing contacts efficiently. Here's a simple implementation of a Contact Management System using C, allows users to perform operations such as adding, viewing, searching, modifying, and deleting contacts through a simple and user-friendly console interface. The CMS provides a practical demonstration of fundamental programming concepts such as arrays, structures, and string manipulation, making it an excellent project for students and beginners in C programming.   Project Overview The Contact Management System is designed to store basic information about contacts, including: Name: name of the person. Phone Number: phone number of the contact. Email Address: email address of the contact.   With this information, the program offers the following functionalities: Add New Contact...
Post a Comment
Show more »

Implementing Basic Add to Cart Functionality in Python Using Flask

By
In e-commerce websites, the "Add to Cart" feature allows users to select products they want to purchase and store them temporarily while they continue shopping. Implementing this functionality in a web application using Python and Flask is straightforward and can be done with a few simple steps.       Setting Up the Project: First, create a new directory for your project and set up a virtual environment to manage dependencies. Install Flask using pip and create three main files: `app.py`, `index.html`, and `cart.html`.   Read also:   Unlocking the Power of Free Google Tools for Seo Success Ultimate Guide: Google Search Console Crawl Reports you need to know Monitor What is dofollow backlinks: The ultimate 5 Benefit for your websites SEO Schema markup and How can you use schema markup for seo      Creating HTML Templates: Create HTML templates for displaying products (`index.html`) and the shopping cart (`cart.html`). These templates will use ...
Post a Comment
Show more »

Advanced HTML Concepts: Techniques and Examples for Modern Web Development

By
Advanced HTML goes beyond the basics of creating simple web pages, delving into powerful features and techniques that improve web interactivity, accessibility, and performance. It includes concepts such as semantic HTML, custom data attributes, responsive images with <picture> , enhanced forms, interactive content using <details> and <summary> , and embedding external resources with <iframe> .          Furthermore, advanced HTML focuses on SEO optimization through meta tags, accessibility improvements using ARIA, creating reusable Web Components, and optimizing performance with async and defer scripts.    Semantic HTML   Semantic elements clearly describe their meaning in a human- and machine-readable way.   <header> <h1>Welcome to My Website</h1> </header> <nav> <ul> <li><a href="home">Home...
Post a Comment
Show more »

Python Flask Student List CRUD System Using MySQL Database for Beginners

By
  In this tutorial, we are going to learn the python flask student list crud system using MySQL database for beginners. Before you have to learn how to python flask setting up and connect MySQL database connection and templates uses.    Read also: Python Flask tutorial Setting up a Flask and Sql Database on the create project folder you have to install two things to fetch data and flask. Here, below code to install using python terminal, and for MySQL, am using xampp software and database inside environment to turn on the apache server and MySQL database.   Read also: Python Flask with Mysql Database Import Flask and MySQL: from flask import Flask, render_template, request, redirect, url_for from flask_mysqldb import MySQL MySQL Database Connection: app = Flask(__name__) app.config['MYSQL_HOST'] = 'localhost' app.config['MYSQL_USER'] = 'root' app.config['MYSQL_PASSWORD'] = '' app.config['MYSQL_DB'] ...
2 comments
Show more »

Microdata Schema : How can Microdata schema Improve SEO with Examples

By
In this article, we will explore what microdata schema is, how it works, and provide some examples to help you better understand its importance. What is Microdata Schema? Microdata schema is a markup language that provides a standardized way of adding structured data to web pages. It uses HTML tags to describe information about the content on a web page, such as product reviews, events, recipes, and more. This makes it easier for search engines to crawl and index the content on a web page, which can help improve the visibility and ranking of the website. How Does Microdata Schema Work? Microdata schema uses a set of properties and item types to describe the content on a web page. Properties describe specific attributes of an item, while item types describe the type of item being described. For example, the property "name" might be used to describe the name of a person, while the item type "Person" would be used to indicate that the content being describ...
Post a Comment
Show more »

How to Create a Personal details information program in HTML

By
In this tutorial, we are learning how you can create a personal details information program in HTML with the simple using of HTML tags. HTML Form: <div class="container"> <h1 style="text-align:center">Personal Details</h1> <form class="form-control"> <label for="name">Name:</label><br> <input type="text" id="name" name="name"><br> <label for="email">Email:</label><br> <input type="email" id="email" name="email"><br> <label for="dob">Date of Birth:</label><br> <input type="date" id="dob" name="dob"><br> <label for="gender">Gender:</label><br> <input type="radio" id="gender" name="gender" value="male...
Post a Comment
Show more »