HTML Common Elements: How to Use Html All Elements 2024?

by | Jan 31, 2024 | HTML CSS Template

Creating a web static page is all HTML common elements can be quite extensive, but I will try to provide you with a complete list of and a brief description of each element. Note that this list may not be 1200 words long, but it should cover most basic HTML common elements. See our more blogs.

1) What is HTML?

HTML (Hypertext Markup Language) is a standard markup language used to create any website. It consists of various html common elements that structure the content of a web page. List of the HTML common elements include:

2) How to Use HTML Tags: A Beginner’s Guide

HTML (HyperText Markup Language) is the backbone of the web. It’s used to structure and present content on web pages. HTML tags are the building blocks of HTML documents. They are enclosed in angle brackets (<>) and typically come in pairs, like <p> and </p>.

<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
</head>
<body>
    <h1>Hello, World!</h1>
    <p>This is my first   
 paragraph.</p>
</body>
</html>  

3) HTML Common Elements List:

<!DOCTYPE>: A document type declaration indicating the version of HTML being used. 

<html>: The root element of the HTML page. 

<head>: Contains meta-information about the document, such as titles and links to external resources. 

<title>: Set the title of the web page that will be displayed in the browser title bar or tab. 

<meta>: Provides metadata about the HTML document, including character encoding and author information. 

<link>: A link to an external resource (such as a CSS style sheet). 

<style>: Contains embedded CSS code for styling the document. 

<script>: Contains JavaScript code or a link to an external script file. 

<body>: Contains the visible content of the website, such as B. text, images, and multimedia. 

<h1> <h2> <h3> <h4> <h5> <h6>: Headings of decreasing importance. 

<p>: Defines a piece of text. 

 <a>: Creates a hyperlink to another website or resource. 

<img>: Embed an image into the document. 

<ul>: Defines an unordered list (bullets). 

<ol>: Defines an ordered (numbered) list. 

<li>: Represents list items within <ul> or <ol>. 

<div>: A general container used for layout and styling purposes. 

<span>: Universal inline container for styling and scripting. 

<table>: Define a table. 

 <tr>: represents table row. 

<td>: Define table data cells. 

<th>: Defines the header cell. 

<caption>: Provide a title or description for the table. 

<form>: Contains form elements for user input. 

 <input>: Represents an input field, such as text, password, or checkbox. 

<textarea>: Create a multi-line text input area. 

<button>: Defines a clickable button. 

 <select>: Create a drop-down selection list. 

<option>: Represents the options in the <select> element. 

<label>: Provides a label for the form element. 

<fieldset>: Group related form elements and add frames. 

<legend>: Provides a label for the <fieldset> element. 

<br>: Inserts a newline character into the text. 

<hr>: Adds a horizontal line to separate content. 

<blockquote>: Specifies a quoted text block. 

<cite>: Specify the title of a creative work, such as B. a book or a movie. 

<abbr>: Defines an abbreviation or acronym. 

<strong>: Indicates strong meaning or emphasis. 

<em>: Emphasis on text. 

 <i>: Display text in italics. 

<b>: Display text in bold. 

<u>: Underline text. 

<sub>: Define subscript text. 

<sup>: Define superscript text. 

<code>: represents computer code. 

<pre>: Preformatted text that preserves spaces and newlines. 

<quote>: Quoting the title of a work, such as B. a book or a movie. 

<dfn>: Definition definition term. 

<mark>: Mark text for reference or emphasis. 

<time>: represents a specific time or date. 

<ins>: Display inserted text. 

<del>: represents deleted text. 

 <kbd>: represents keyboard input. 

<samp>: Displays sample output of the program. 

<var>: represents variables in programming. 

<address>: Contains contact information for the author or owner of the web page. 

<cite>: Defines the title of the work, such as B. a book or a movie. 

<q>: Creates inline quotes. 

<ruby>: Provides Ruby annotations for pronunciation in East Asian typography. 

<iframe>: Embed an inline frame to display another web page. 

<object>: Embed external multimedia content, such as Flash or Java applets. 

<embed>: Embed multimedia content directly into the page. 

<audio>: Embed audio content, such as music or sounds. 

<video>: Embed video content. 

<source>: Specify multiple media resources for <audio>, <video> and other projects. 

<canvas>: Provides a drawing surface for graphics and animation using JavaScript. 

<svg>: Embed scalable vector graphics. 

 <map>: Defines a clickable image map for use with <img>. 

<area>: Defines a clickable area within the image map. 

<header>: A container that represents introductory content or a series of navigation links. 

<nav>: Defines navigation links. 

 <main>: Contains the main content of the document. 

<article>: represents an independent article, such as a blog post. 

<section>: Defines the content section in the article. 

<aside>: Contains content that is directly related to surrounding content. 

<footer>: Represents the footer of a section or document. 

 <figure>: Contains media content such as images or videos and titles. 

<figcaption>: Provides a title for the <figure> element. 

<details>: Create a public widget that can show or hide content. 

 <summary>: Represents the summary or title of the <details> element. 

<mark>: Mark text in the document. 

<time>: represents a specific time or date. 

<wbr>: Indicates the possibility of newlines in long words or URLs. 

<Dialog>: Defines a dialog box or modal window. 

<progress>: Display the progress bar. 

<meter>: Represents a scalar measurement within a known range. 

 <ruby>: Provides Ruby annotations for East Asian typography. 

 <bdi>: Isolate portions of text that may be formatted in different directions. 

 <bdo>: Override text direction. 

<small>: Indicates smaller text. 

<Abbreviation>: Define abbreviation. 

 <applet>: Embeds a Java applet (deprecated). 

<noframes>: Content displayed when providing unsupported (deprecated) frames. 

 <frame>: Defines the frame in the frameset (deprecated). 

<marquee>: Create scrolling text or images (deprecated). 

4) Conclusion    

These are some of the most nature HTML common elements you’ll encounter when creating web pages. While this list may not be words long, it should give you a good understanding of the basic building blocks of HTML common elements. Keep in mind that HTML common elements has deprecated or removed many older elements in favor of modern web development using CSS and JavaScript. 

Those are just some of the HTML common elements used to structure and format content on website. HTML common elements rules a flexible markup for creating rich and interactive web experiences.