Every time you visit the internet, you interact with HTML codes and related tags. HTML is primarily used to develop web pages as well as web applications that run on different web browsers like Google Chrome, Firefox, or Microsoft Edge. So, let’s understand the concept of HTML and different HTML tag use.
What is HTML?
HTML stands for Hypertext Markup Language. It is the language used to describe structured documents and for creating web pages online. You can use a variety of text editors to write the HTML codes. Alternatively, you can also leverage free tools such as HTML Editor or Word to HTML Converter to write or edit your codes.
Define Tag in HTML
HTML tags are like keywords that are used to produce web pages in different formats. With the aid of HTML code tags, a web browser can distinguish between HTML content and simple content. There are three parts of an HTML tag- the opening tag, the content, and the closing tag. You can also find some HTML tags with unclosed tags.
A web browser reads an HTML tag from top to bottom, and from left to right. You can use these tags to create HTML documents and render their properties. For example, <html> is the opening tag, whereas </html> is the closing tag. Note that the closing tag has the same text as the opening tag, but has an additional forward slash (/) character.
Each HTML tag has different properties which you can use for different purposes. An HTML file needs to consist of some essential tags. This helps the web browsers understand the differences between HTML and simple content. You can use as many tags according to your code requirements.
A to Z list of HTML Tags
Here is the complete list of different types of tags in HTML:
| Tag Name | Function |
|---|---|
| <!– –> | This tag is used to apply comments in an HTML document. |
| <!DOCTYPE> | Used for specifying the version of HTML being used. |
| A | |
| <a> | Termed as the anchor tag, an important tag in HTML, it is used to create a hyperlink or link. |
| <abbr> | This tag defines an abbreviation for a phrase or longer word. |
| <acronym> | It defines the acronym for a word that gives useful information to browsers, search engines, and translation systems. (Not supported in HTML5) |
| <address> | It indicates the contact information of a person or an organization. |
| <applet> | Used for embedding Java applets into any HTML document. (Not supported in HTML5) |
| <area> | Used in an HTML document to map a portion of an image so that it becomes clickable for the end-user. |
| <article> | Represents an article and is a new sectioning element in HTML5. |
| <audio> | Used for embedding sound in content in HTML documents. |
| <aside> | It defines content aside from the main content and is represented as a sidebar. |
| B | |
| <b> | This tag makes the text bold. |
| <base> | Defines the base URL for all relative URLs in a document. |
| <basefont> | Used for setting a default font, size, as well as color for all elements of a document.(Not supported in HTML5) |
| <bdi> | Stands for Bi-directional isolation and differentiates a text from other text that may be formatted in different directions from its surrounding text. |
| <bdo> | Stands for Bi-directional override and is used to specify the text directions used to change the current direction of the text. |
| <bgsound> | Used for playing the soundtrack in the background. |
| <big> | Used for increasing the size of the selected text by one size larger than the surrounding text.(Not supported in HTML5) |
| <blockquote> | Used for displaying a quotation/content taken from another source. |
| <body> | Used for defining the body section of an HTML document. |
| <br> | Used for applying a single link break. |
| <button> | Used for representing a clickable button. |
| C | |
| <canvas> | Used for providing a graphics space within a web document and can be used for drawing paths, boxes, texts, gradients, and adding images. |
| <caption> | Used for defining a caption for a table. |
| <center> | Used for aligning the content in the center.(Not supported in HTML5) |
| <cite> | Used for defining the title of a work, book, or website, among others. It displays the text in italic format. |
| <code> | Used for displaying a part of the programming code in an HTML document. |
| <col> | Defines a column within a table which represents common properties of columns and used with <colgroup> elements. |
| <colgroup> | Useful for applying styles to entire columns, instead of repeating the styles for each column and row separately. |
| D | |
| <data> | This tag links the content within machine-readable translation. |
| <datalist> | Used for providing a predefined list for input options. It has an autocomplete feature and is used with an input tag so that users can easily fill relevant data into forms using the given data. |
| <dd> | Used for denoting definition/description of a term in the description list. |
| <del> | Defines the text which has been deleted from a document. |
| <details> | Can be used to create an interactive widget that defines the additional details which a user can either view or hide. |
| <dfn> | Used for indicating a term which is defined with a sentence or phrase. |
| <dialog> | It defines a dialog box or other interactive components. |
| <dir> | Used as a container for a directory list of files.(Not supported in HTML5) |
| <div> | Used for making divisions of content in a web page. It can be used for dividing text, images, headers, footers, navigation bar, among others. |
| <dl> | Used for defining a description list. |
| <dt> | Used for defining a term in the description list. It is usually used inside the <dl> element and followed by a <dd> tag. |
| E | |
| <em> | Used for emphasizing the content applied within this element. |
| <embed> | Used as an embedded container for external files, or applications or media, etc. |
| F | |
| <fieldset> | Used for grouping related elements/labels within a web form. |
| <figcaption> | Used for adding a caption or explanation for the <figure> element. |
| <figure> | Used for defining the self-contained content like diagrams, illustrations, photos, or codes in a document and is mostly referred to as a single unit. |
| <font> | It defines the font, size, color, and face for the content and helps in creating a readable web page.(Not supported in HTML5) |
| <footer> | Defines the footer section of a webpage. |
| <form> | Used for defining an HTML form used for the registration process and logging into a profile among others. |
| <frame> | Defines a particular area of a web page which can contain another HTML file.(Not supported in HTML5) |
| <frameset> | Defines a group of frames and is used to specify the number of rows and columns used in a frameset with their pixel of spaces.(Not supported in HTML5) |
| H | |
| <h1> to <h6> | This tag defines headings for an HTML document from level 1 (the highest level) to 6 (the lowest level). |
| <head> | Defines the head section of an HTML document. |
| <header> | Defines the header of a section or web page. |
| <hgroup> | Used for wrapping one or more heading elements from <h1> to <h6>, such as the headings and subheadings. |
| <hr> | Used for applying thematic breaks between paraphrase-level elements. |
| <html> | Represents the root of HTML and XHTML documents. |
| I | |
| <i> | This tag is used to represent a text in a different language. |
| <iframe> | Defines a rectangular region within a document which a browser can display in a separate document. |
| <img> | Used for inserting an image within an HTML document. |
| <input> | Defines an input field within an HTML form. |
| <ins> | Represents text that has been inserted within an HTML document. |
| <isindex> | Used for displaying search strings for current documents or query any document through a text field. (Not supported in HTML5) |
| K | |
| <kbd> | It is used to define keyword input and is typically displayed in the browser’s default monospace font. |
| <keygen> | Used for specifying a key-pair generator field in a form which is created when a form is submitted- a private key and a public key. |
| L | |
| <label> | Defines a text label for the input field of a form. |
| <legend> | Defines a caption for the content of <fieldset> or the child contents. The legend elements are the parent element. |
| <li> | Represents items in a list. When used within an ordered list, it is written <ol> and for unordered list, it is written as <ul>. |
| <link> | Represents a relationship between a current document and an external resource. |
| M | |
| <main> | This tag represents the main content of an HTML document. |
| <map> | It defines an image map with active areas. |
| <mark> | Represents a marked or highlighted text. |
| <marquee> | Used for inserting the scrolling text or an image in either horizontal or vertical format. (Not supported in HTML5) |
| <menu> | Used for creating a menu list of commands. |
| <menuitem> | Defines a command or menu that a user can utilize from popup items. (Not supported in HTML5) |
| <meta> | Defines metadata of an HTML document. |
| <meter> | Defines the scalar measurement with known range and also supports the fractional value. |
| N | |
| <nav> | Used for declaring the navigational section in HTML documents that makes it easier for users to navigate a site. |
| <nobr> | Used for creating a single line text. It does not matter how long a statement is and is used with the <wbr> tag. |
| <noembed> | Used for showing that a browser is not supported by the <embed> tag. |
| <noframes> | Provides alternate content to represent in the browser which does not support the <frame> elements.(Not supported in HTML5) |
| <noscript> | Provides an alternative content if a script type is not supported by the browser. |
| O | |
| <object> | Used for embedding an object in an HTML file. |
| <ol> | Defines an ordered list of items, thereby, a list tag in HTML. |
| <optgroup> | Use for grouping options of a drop-down list. |
| <option> | Used for defining options or items in a drop-down list. |
| <output> | Used as a container element which can show results of a calculation. |
| P | |
| <p> | This tag represents a paragraph in an HTML document. |
| <param> | Defines a parameter for plug-ins which is associated with <object> elements. |
| <phrase> | Indicates the structural meaning of a block of text. |
| <picture> | Defines more than one source element and one image element. |
| <pre> | Defines preformatted text in an HTML document and preserves the text spaces. |
| <progress> | Defines the progress of a task within an HTML document. |
| Q | |
| <q> | This tag is a standard tag used for short quotations. |
| R | |
| <rp> | Defines an alternative content if a browser does not support ruby annotations. It provides parenthesis around a ruby main text, defining the information. |
| <rt> | Defines the explanations and pronunciations in ruby annotations which is a small text, attracted to the main text. |
| <ruby> | Used for representing ruby annotations. |
| S | |
| <s> | This tag is used to render text which is no longer correct or relevant. |
| <samp> | Used for representing sample output of a computer program. It is an output tag in HTML. |
| <script> | Used to declare the JavaScript or client-side script within an HTML document. |
| <section> | Defines a generic section of a document such as chapters, headers, footers, or other sections. |
| <select> | Represents a control which provides a menu of options. |
| <small> | Used for making text font one size smaller that document’s base font size. |
| <source> | Defines multiple media resources for different media elements in HTML such as <picture>, <audio>, and <video> element. |
| <spacer> | Used for creating some white space.(Not supported in HTML5) |
| <span> | Used for styling and grouping inline elements and content. |
| <strike> | Defines a strike or line through a text.(Not supported in HTML5) |
| <strong> | Used for defining important text and it makes the text bold. |
| <style> | This tag consists of style elements and is helpful for designing a web page. |
| <sub> | Defines a text which displays a subscript text. |
| <summary> | Defines the summary and can be used with the <details> tag. |
| <sup> | Defines a text which displays a superscript text. |
| <svg> | Used as a contailer of the scalable vector graphics (SVG). |
| T | |
| <table> | Used for presenting data in a tabular form or creating a table within a HTML document. |
| <tbody> | Represents the body content of an HTML table and is used along with <thead> and <tfoot>. |
| <td> | Used for defining standard cells of an HTML table which contains table data. |
| <template> | Used for containing the client-side content which will not display at time of when the page is loading and may render later using JavaScript. |
| <textarea> | Usedfor defining multiple line input, such as comment. feedback, and review. |
| <tfoot> | Defines the footer content of an HTML table. |
| <th> | Defines the head cell of an HTML table.(Not supported in HTML5) |
| <thead> | Defines the header of an HTML table and is used along with <tbody> and <tfoot>. |
| <time> | Used for defining data or time within an HTML document in a machine-readable format. |
| <title> | Defines the title or name of an HTML document. |
| <tr> | Defines the row cells in an HTML table. It contains multiple <th> or <td> elements. |
| <track> | Used for defining text tracks for <audio> and <video> elements. |
| <tt> | Used for defining teletype text and helped in marking keyboard input.(Not supported in HTML5) |
| U | |
| <u> | This tag is used for rendering enclosed text with an underline. |
| <ul> | Defines unordered list of items. |
| V | |
| <var> | Defines variable names used in mathematical or programming context. |
| <video> | Used for embedding a video content with an HTML document. |
| W | |
| <wbr> | Defines a position within a text where a break line is possible. |
| X | |
| <xmp> | Used for creating any content in letter format. |
Conclusion
Thus, there are numerous HTML tags with distinctive functions. HTML is the foundation of webpages and by using this language, you can develop web pages as well as web apps. So, thoroughly understand all tags by following this best guide of tag lists to grasp a clear understanding of how and where to use the HTML tags.
