Understanding HTML Tags
Your guide to the building blocks of web development.
What are HTML Tags?
HTML (HyperText Markup Language) tags are the fundamental building blocks of web pages. They are used to create elements on a webpage, defining the structure and content of your site.
Types of HTML Tags
HTML tags can be categorized into different types based on their usage:
- Structural Tags: These tags structure the webpage. For example:
<html>
: Defines the root of an HTML document.<head>
: Contains meta-information about the document.<body>
: Contains the content of the document.
- Text Formatting Tags: These tags format text, such as:
<h1> to <h6>
: Defines headings of different levels.<p>
: Defines a paragraph.<strong>
and<em>
: Used for bold and italic text, respectively.
- Linking Tags: These tags create hyperlinks, for example:
<a>
: Defines a hyperlink to another webpage or a location on the same page.
- Media Tags: These tags support media elements:
<img>
: Embeds images in the webpage.<audio>
and<video>
: Used to incorporate sound and video files.
- List Tags: These tags are used to create lists:
<ul>
: Defines an unordered (bulleted) list.<ol>
: Defines an ordered (numbered) list.<li>
: Defines a list item.
Attributes of HTML Tags
HTML tags can have attributes that provide additional information about the element. Common attributes include:
id
: A unique identifier for the element.class
: Specifies one or more class names for the element.style
: Applies inline CSS to the element.src
: Specifies the path to an image or media file.href
: Specifies the URL of a linked page.
Common HTML Tags Examples
Here are a few simple examples of commonly used HTML tags:
Example of a basic HTML document:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sample Page</title>
</head>
<body>
<h1>Welcome to My Webpage</h1>
<p>This is a simple example of an HTML document.</p>
</body>
</html>
Using the image tag:
To add an image, you might use:
<img src="image.jpg" alt="Description of the image">