Comprehensive Guide to HTML Attributes
HTML Attributes Reference Summary
HTML attributes provide additional information about HTML elements. They are always specified in the opening tag and come in name/value pairs.
Key Concepts
- Definition: Attributes are used to modify the behavior or appearance of HTML elements.
- Structure: An attribute is written as a name followed by an equal sign and the value in quotes.
- Example:
<element attribute="value">
- Example:
Common Attributes
1. Global Attributes
These attributes can be used on any HTML element.
- class: Specifies one or more class names for an element.
- Example:
<div class="container">
- Example:
- id: Unique identifier for an element.
- Example:
<p id="para1">
- Example:
- style: Inline CSS styles for an element.
- Example:
<h1 style="color:blue;">Hello World</h1>
- Example:
- title: Provides additional information about an element (shown as a tooltip).
- Example:
<img src="image.jpg" title="This is an image">
- Example:
2. Specific Attributes
These attributes apply to specific HTML elements.
- href: Used in
<a>
(anchor) tags to specify the URL.- Example:
<a href="https://www.example.com">Visit Example</a>
- Example:
- src: Specifies the source of an image in
<img>
tags.- Example:
<img src="picture.jpg" alt="Description">
- Example:
- alt: Provides alternative text for images.
- Example:
<img src="logo.png" alt="Company Logo">
- Example:
- value: Defines the value of form elements like
<input>
.- Example:
<input type="text" value="Enter your name">
- Example:
Conclusion
Understanding HTML attributes is crucial for web development as they enhance the functionality and accessibility of web pages. Familiarity with common attributes and their usage will help you create more interactive and user-friendly websites.