HTML - Tags

HTML Tags

HTML tag is made up of character(s) - words, letters, figures; that are enclosed by angle brackets.

Categories of Tags

The two major categories of tags are: Regular closing tags and Self closing tags.

REGULAR CLOSING TAGS

  • These are tags that needs to be closed manually by its closing tag. Examples are: html, head, title, body, h1 - h6, and p. These tags have opening and closing tags.
  • <html> ....... </html>
    <head> ....... </head>
    <title> ....... </title>
    <body> ....... </body>
    <h1> ....... </h1>
    <p> ....... </p>

SELF CLOSING TAGS

  • These are tags that do not require a closing tag. It has the just one tag that includes a forward slash / before the closing angle bracket. Examples are: link, a, br, hr, img, etc.
  • <link />
    <a />
    <br />
    <hr />
    <img />

Types of Tags (Grouped)

There are numerous types of tags in html. These tags can be grouped into the following:

META TAGS

  • They are used to provide additional information about the HTML page to browsers, search engines and other clients.
    <!DOCTYPE html>
    <html>....</html>
    <head>....</head>
    <title>.... </title>
    <link />
    <meta />
    <style>....</style>

TEXT TAGS

  • They are used to write different kinds of text on the webpage.
    <h1>....</h1>
    <h2>....</h2>
    <h3>....</h3>
    <h4>....</h4>
    <h5>....</h5>
    <h6>....</h6>
    <p>....</p>
    <pre>....</pre>
    <address>.... </address>
    <abbr>....</abbr>
    <q>....</q>
    <acronym>....</acronym>
    <cite>....</cite>
    <blockquote>....</blockquote>

LINK TAGS

  • They are used to point or open to another set location. Usually contains an address of that location.
    <a>.... </a>
    <link />
    <base />

LIST TAGS

  • They are used arrange texts in a list format.
    <ul>....</ul>
    <li>....</li>
    <ol>....</ol>
    <dl>....</dl>
    <dt>....</dt>
    <dd>....</dd>

TABLE TAGS

  • They are used arrange texts in a rows and columns.
    <table>....</table>
    <thead>....</thead>
    <th>....</td>
    <tbody>....</tbody>
    <tr>....</tr>
    <td>....</td>
    <tfooter>....</tfooter>
    <colgroup>....</colgroup>
    <col>

FORM TAGS

  • They are used when creating html forms
    <form>....</form>
    <fieldset>....</fieldset>
    <optgroup>....</optgroup>
    <label>....</label>
    <input />
    <option>....</option>
    <textarea>....</textarea>
    <select>....</select>
    <button>....</button>

IMAGE, VIDEO AND OBJECT TAGS

  • They are used to insert images and objects inside your HTML document
    <img />
    <area />
    <object>....</object>
    <video>....</video>
    <audio>....</audio>
    <source />
    <param />
    <map>....</map>

SCRIPTING TAGS

  • They are used to link script files to the HTML document
    <script>....</script>
    <noscript>....</noscript>
tips
TIP:

There are tags that work as regular closing tags and self closing tags. For example: Input tag.

Case Sensitivity

HTML is not case sensitive. <h1> is the same thing as <H1>. But I will advise that you use lowercase at all times for smooth and clean coding.

Tag References

HTML has a lot of tags that you can use for various purpose, to see more tags and what they are being used for, later you can visit Tag References. But for now, these are the basic ones you will often used most of the time.

ADVERTISEMENTS

LEARNING IS A CONTINOUS PROCESS - PRACTICE MAKES PERFECT