HTML TAGS

All HTML tags and description

HTML: 

HTML full form Hyper Text Markup Language. HTML isn’t a programming language. HTML contains tags. Internet browsers utilize these labels to show markup in website pages.

Let’s discuss all html tags and their details:

There are two types of html tags:

  • Single Tag
  • Double Tag

Single tag is not paired, other hand double tag is paired. Single tags can be close, or not. Modern browsers can detect single tags, so it’s not mandatory to close it. But a double tag must be needed. Another thing, HTML is not case sensitive, uppercase and lowercase letters both work for writing a tag, but it’s recommended to write all tags in lowercase letter.

<!DOCTYPE>:

DOCTYPE html tag has come in HTML 5 version. It’s a single tag that defines the document type of a document. Like in a html file we need to declare it likes

“<!DOCTYPE html>”. It’s a single tag.

<html>:

Use for start the html content. After doctype we need to declare it, and html all tags containing between html tags start and end.

<head>:

Head tag contains metadata/information for the document. Like title tag, link tag etc.

<title>:

Title tags contain the title of the document. It’s showing in the browser tab title. 

<body>:

Body tag contains all html content tags. We implement the html markup inside the body tags.

<h1>:

Heading 1 tag is the big heading. For defining big heading in a document we use h1 tag.

<h2>:

Heading 2 tags is the 2nd big heading. For defining heading in a document we use h2 tag.

<h3>:

Heading 3 tags is the 3rd big heading. For defining heading in a document we use h3 tag.

<h4>:

Heading 4 tags is the 4th big heading. For defining heading in a document we use h4 tag.

<h5>:

Heading 5 tags is the 5th big heading. For defining heading in a document we use h5 tag.

<h6>:

Heading 6 tags is the smallest heading. For defining the smallest heading in a document we use h6 tag.

<p>:

For writing paragraphs in web pages, we use p tag. 

<br>:

For line break we use br tag.

<hr>:

For displaying a horizontal line, we hr tag. 

<!–…–>:

It’s not a tag, it’s a syntax for writing a comment in a html web page.

<acronym>:

It’s used for writing abbreviations of a word, but it’s not supported in HTM 5.

<abbr>:

abbr tag is used instead of acronym tag. Meaning it’s used for writing abbreviations of a word in a web page. It’s supported by HTML 5 also.

<address>:

It’s used for writing addresses.

<b>:

It’s used for writing in bold format. If any word/sentences wrap with b tag, then it shows a bolder look on the web page.

<bdi> :

This tag isolates a part of text that might be formatted in a different direction from other text outside it.

<bdo>:

Use for changing the direction of a text. It’s done by attributes, dir=”rtl”. By default this attribute’s value is ltr.

<big>:

Big tag is used for showing big size text. But it’s not supported in HTML . Now it’s done by CSS.

<blockquote>:

Blockquote tag used for showing content that is taken from another source.

<center>:

To align text in center, we use the center tag. But HTML 5 not support center tag. So use CSS is the better for align.

<cite>:

To show the title of the work, we use cite tag.

<code>:

For display code, we use code tag. It’s showing the code in monospace font.

<del>:

For displaying deleted type text, del tag is used. It display the text like strikethrough style.

<dfn>:

dfn tag defines a specific term in a document. It’s showing the text as an italic style.

<em>:

em tag is used for showing strengthened text in a document. It’s showing text in italic style.

<font>:

For working with different font faces, size, color, we use font tag. But in HTML 5 the font tag is not supported. So, we should use CSS for this.

<i>:

i tag is used for displaying text in italic style. Also it defines a specific term in text.

<ins>:

If we want to show a text as an insert format in a web page, then the ins tag will be used. It’s showing in italic style on the web page.

<kbd>:

kbd tag defines the keyboard input. It’s showing the text in monospace font.

<mark>:

For highlighting text in a web page, mark is used. By default it’s highlighted in a yellow background, and black color font.

<meter>:

It defines a scalar measurement within a known range (a gauge). 

<pre>:

It defines a preformatted text.

<progress>:

Represents the progress of a task.

<q>:

It defines a short quotation.

<rp>:

It defines what to show in browsers that do not support ruby annotations.

<rt>:

It defines an explanation/pronunciation of characters (for East Asian typography).

<ruby>:

It defines a ruby annotation (for East Asian typography).

<s>:

It defines a text that is no longer correct. It displays the text as strikethrough text.

<samp>:

It defines a sample output from a computer program.

<small>:

It defines a smaller text.

<strike>:

Displaying strike text, but not support in HTML 5.

<strong>:

It defines an important text. It displays the text as bold.

<sub>:

It shows text as a subscripted text. Like a2

<sup>:

It shows a text as superscript text. Like a2

<template>:

It makes a content area which is hidden when the page is loaded.

<time>:

For showing a time, we use this tag.

<tt>:

For showing teletype text, tt is tag work. But it’s not supported in HTML 5.

<u>:

This tag is use for showing a different styling term. It’s showing text as underline text. 

<var>:

For showing variables, we can use variable tag.

<wbr>:

Wbr stands for Word Break Opportunity. That means if somewhere we need to create an opportunity to break the line, then we can use the wbr tag there.

<form>:

For creating forms, we use form tag. 

<input>:

To create an input field, we use the input tag.

<textarea>:

If we need to create a textarea, we need a textarea tag.

<button>:

For creating clickable buttons, we need to use button tag.

<select>:

With the select tag, we can create a dropdown list, where the user can select an option.

<optgroup>:

optgroup tag creates an option group. 

<option>:

It’s create option for the select tag. 

<label>:

Create a label for the input tag. That means it creates a title for the input field.

<fieldset>:

A categorized form is in a fieldset tag.

<legend>:

Title for fieldset tags.

<datalist>:

Create a list for a specific input field.

<output>:

For showing output results. 

<frame>:

It’s showing a frame in a frameset, but not supported in HTML 5.

<frameset>:

It’s showing a set of frames, but it’s also not supported in HTML 5.

<noframes>:

Create a no frame area, but it’s also not supported in HTML 5.

<iframe>:

Creating an inline frame. With this we can create an external website from our own page, with creating a just iframe area.

<img>:

For showing images, we need to use an img tag.

<map>:

For showing maps, we use map tag.

<area>:

Create an area inside the map.

<canvas>:

This tag is used for showing graphics in the web page.

<figure>:

Create a figure area.

<figcaption>:

It creates a caption area for the figure tag.

<picture>:

It creates a multiple image area, where different images are shown with different screen sizes.

<svg>:

Create an svg images area.

<audio>:

Use for implementing mp3 or audio content inside a web page.

<source>:

It creates multiple media resources for media tags like <video>, <audio>, and <picture>.

<track>:

It creates text tracks for media tags <video>  and <audio>.

<video>:

Use for implementing a video on a web page.

<a>:

This tag is used for creating a link.

<link>:

This tag creates links between external files in web pages.

<nav>:

This is used to declare a navigation area/ menu area.

<ul>:

Ul tag is used for creating an unordered list.

<ol>:

ol tag is used for creating an unordered list.

<li>:

li tag is used for creating a list item.

<dir>:

Use for creating directory type lists. But not supported in HTML 5. 

<dl>:

dl is used for creating directory lists. 

<dt>:

dr is used for creating directory list items. 

<dd>:

dd is used for creating directory list items description. 

<table>:

For creating a table, we use table tag.

<caption>:

For writing table captions, caption tags are used.

<th>:

th tag used for creating table heading.

<tr>:

Create a table row with tr tag.

<td>:

Create a table column with a td tag.

<thead>:

Create a table head for the group of columns.

<tbody>:

Create a table body for the group of columns.

<tfoot>:

Create a table footer for the group of columns.

<col>:

Create columns for tables. 

<colgroup>:

Create a col group for table columns.

<style>:

Create a style area for a web page.

<div>:

Create a section in a document with a div tag.

<span>:

Create an inline section with a span tag.

<header>:

header tag creates a header area for the web page.

<footer>:

footer tag creates a footer area for a web page.

<main>:

main tag creates a main/content area for a web page.

<section>:

section tag is create new section for the web page,

<article>:

For writing articles, an article tag is needed.

<aside>:

It’s used for creating sidebars in a web page.

<details>:

Create a details area with a details tag in a web page.

<dialog>:

Dialog tag is used for creating a dialog box or window.

<summary>:

It defines a  visible heading for a <details> tag.

<data>:

It adds a machine-readable translation of a given content

<meta>:

It defines the metadata about the web page

<base>:

This base tag specifies the base URL/target for all relative URLs in a document.

<basefont>:

Specifies the color, size, font etc. but not supported in HTML5.

<script>:

Create a script area for a web page.

<noscript>:

Create no script area in a web page with a noscript tag.

<applet>:

It defines an embedded applet. But now it is not supported in HTML 5.

<embed>:

Create a container for the external application.

<object>:

For creating or embedded objects, object tags are required.

<param>:

It’s create a parameter for an object

Leave a Comment

Your email address will not be published. Required fields are marked *