All HTML Tags with Description.

 

HTML All Tags with Description:

HTML tags are categorized based on their functionality to make them easier to understand:

 

1.      Document Structure Tags

Tag                                           Description
<html>                Root element of an HTML document.
<head>              Contains metadata, links to stylesheets, scripts, and other non-visible content.
<title>                 document's title shown in the browser tab.
<body>               visible content of the web page.
<meta>               metadata (e.g., char set, viewport settings).
<link>                  Links to external resources like style sheets and icons.
<style>                CSS styles directly in the document.
<script>               JavaScript code or links to external scripts.
<!DOCTYPE>          Declares the document type (HTML5).

2.      Text Formatting and Sematic Tags

Tag                                           Description

<h1> to <h6>               <h1> as the largest and <h6> as the smallest.
<p>                             paragraph.
<br>                               line break.
<hr>                                 Inserts a horizontal rule.
<b>                              bold text (without semantic importance).
<strong>                       bold text with semantic importance.
<i>                               text italic text (without semantic importance).
<em>                            italic text with semantic emphasis.
<mark>                         Highlights text.
<small>                         smaller text.
<del>                            deleted text.
<ins>                            inserted (underlined) text.
<sub>                           subscript text.
<sup>                           superscript text.
<blockquote>                 block of quoted text.
<q>                               inline quote.
<code>                          mono spaced font.
<pre>                            preformatted text (preserves whitespace and line breaks).
<span>                          Inline container for styling or grouping text.
<div>                             Block-level container for grouping elements.


3.      List Tags

Tag                                           Description
<ul>                             Creates an unordered (bulleted) list.
<ol>                             Creates an ordered (numbered) list.
<li>                              Represents a list item in <ul> or <ol>.
<dl>                             description list (key-value pairs).
<dt>                             Represents a term in a description list.
<dd>                            description for a term in a description list.

4.      Link and Media

Tag                                           Description
<a>                                creates a hyperlink.
<img>                             image.
<figure>                          image with a caption.
<figcaption>                    caption for content inside a <figure>.
<audio>                              audio content.
<video>                          video content.
<source>                        multiple media sources for <audio> and <video>.
<track>                           subtitles or captions for <video> or <audio>.
<iframe>                             Embeds another HTML document within the current document.
<embed>                        external content, like plugins, media.
<object>                         multimedia objects (Flash, PDF)

5.      Tables

Tag                                           Description

<table>                            table.
<tr>                                 row in a table.
<td>                                data cell in a table.
<th>                                header cell in a table.
<thead>                           header content in a table.
<tbody>                           body content in a table.
<tfoot>                                 footer content in a table.
<caption>                        title or caption for a table.
<col>                              Specifies column properties (width).
<colgroup>                      Groups multiple <col> elements.

6.      Forms and Input

Tag                                           Description
<form>                               form for user input.
<input>                              Creates an input field like text, checkbox, radio, etc.
<textarea>                          multi-line text input.
<button>                             clickable button.
<label>                               Defines a label for an <input> element.
<fieldset>                            Groups related form controls.
<legend>                            Provides a caption for a <fieldset>.
<select>                              for dropdown list.
<option>                             Defines an item in a <select> list.
<datalist>                                 Provides auto complete options for an <input> element.
<output>                             result of a calculation or script.
<progress>                          progress for a task.
<meter>                              measurement within a range.

7.      Semantic Element

Tag                                           Description
<header>                              header for a document or section.
<footer>                                footer for a document or section.
<nav>                                   navigation menu.
<main>                                 main content of a document.
<article>                                Represents piece of content (blog post).
<section>                              thematic grouping of content.
<aside>                                 Represents related to the main content (sidebar).
<address>                             Represents contact information for the author and owner of a document.
<time>                                  specific time or date.

8.      Programming and APIs

Tag                                           Description
<noscript>                             Displays content if JavaScript is disabled.
<template>                            Defines reusable, hidden content for JavaScript.
<canvas>                              Provides a drawing surface for graphics via JavaScript.
<svg>                                   Embeds scalable vector graphics.

9.Deprecated/Obsolete Tags

Some tags are no longer supported in modern HTML standards, such as:

<font>                          Used for styling text, replaced by CSS.
<center>                      Used for centering content, replaced by CSS.
<marquee>                  Used for scrolling text, considered outdated.

Why These Tags Are Deprecated:
<marquee>:Deprecated due to its lack of accessibility and the availability of CSS animations for similar effects.
<center>:Deprecated because centering content should be handled via CSS using text-align or margin.
<font>:Deprecated in favor of CSS for styling text, as CSS provides more flexibility and separation of content and presentation

Modern Approach: 
Instead of using these tags, modern HTML relies on CSS for styling (font-familytext-align) and animations (@keyframes) for effects like scrolling text. This ensures better accessibility, maintainability, and compliance with standards.

Post a Comment

Previous Post Next Post