Basic HTML Tags - Top 20 Tags

HTML (Hypertext Markup Language) is the standard language used to create and design web pages. HTML consists of a series of tags that define the structure and content of a web page. Each HTML tag is enclosed in angle brackets (< >) and comes in pairs, with an opening tag and a closing tag. Here are some common HTML tags along with their descriptions:

<!DOCTYPE html>:
- Defines the document type and version of HTML being used. Example:
<html>:
- The root element that wraps the entire HTML document. Example:
- <html>  </html>
<head>:
- Contains meta-information about the HTML document, such as the title, character set, and linked stylesheets. Example:
- <head>  </head>
<title>:
- Sets the title of the HTML document, which appears in the browser's title bar or tab. Example:
- <title>My Web Page</title>
<body>:
- Contains the main content of the HTML document, such as text, images, links, and other elements. Example:
- <body>  </body>
<h1> to <h6>:
- Headings ranging from the largest (<h1>) to the smallest (<h6>). They define the structure of the document and contribute to SEO. Example: <h1>This is Heading 1</h1> <h2>This is Heading 2</h2>
<p>:
- Defines a paragraph of text. Example:
- <p>This is a paragraph of text.</p>
<a>:
- Creates a hyperlink. The href attribute specifies the URL to which the link points. Example: <a href="https://www.example.com">Visit Example.com</a>
<img>:
- Embeds an image into the HTML document. The src attribute specifies the image file's URL. Example:
- <img src="image.jpg" alt="Description of the image">
<ul>, <ol>, <li>:
- <ul> creates an unordered (bulleted) list, <ol> creates an ordered (numbered) list, and <li> defines list items within these lists. Example:
- <ul> <li>Item 1</li> <li>Item 2</li> </ul>
<div>:
- A container element that groups other HTML elements together, allowing you to apply styles or scripts to the grouped content. Example:
- <div>  </div>
<span>:
- Similar to <div>, but used for inline elements. It is often used to apply styles or scripts to a specific portion of text within a larger block of content. Example:
- <span>This is inline content</span>
<br>:
- Inserts a line break within text, forcing subsequent content to appear on a new line. Example:
- This is text.<br> This appears on a new line.
<hr>:
- Creates a horizontal line, often used to separate sections of content. Example:
- <p>Above the line</p> <hr> <p>Below the line</p>
<strong>, <em>:
- <strong> is used to define strong importance or emphasis, and <em> is used for emphasized text. Example:
- <p>This is <strong>strong</strong> text.</p> <p>This is <em>emphasized</em> text.</p>
<a href="mailto:">:
- Creates a mailto link, allowing users to send an email by clicking the link. The email address is specified in the href attribute. Example:
- <a href="mailto:info@example.com">Email Us</a>
<form>:
- Defines an HTML form for user input. It can contain various input elements, such as text fields, buttons, checkboxes, and more. Example:
- <form action="/submit" method="post">  </form>
<input>:
- Represents an input field that allows users to enter data. The type attribute specifies the type of input (text, password, checkbox, radio, etc.). Example:
- <input type="text" name="username" placeholder="Enter username">
<label>:
- Associates a label with a form element, improving accessibility and user experience. Example:
- <label for="username">Username:</label> <input type="text" id="username" name="username">
<select>, <option>:
- <select> creates a dropdown list, and <option> defines individual options within that list. Example:
- <select> <option value="option1">Option 1</option> <option value="option2">Option 2</option> </select>

These are just a few of the many HTML tags available. Understanding these tags is essential for creating well-structured and semantically meaningful web pages. As you become more familiar with HTML, you'll discover additional tags and attributes that provide even greater flexibility and functionality.