What are HTML Attributes?
HTML attributes provide additional information about elements. They are always defined in the opening tag and usually come in name-value pairs.
HTMLRead-only
1
Basic Syntax
HTMLRead-only
1
Common HTML Attributes
| Attribute | Description | Example |
|---|---|---|
| href | Link destination | <a href="url"> |
| src | Image source | <img src="img.png"> |
| alt | Alternative text | <img alt="image"> |
| id | Unique identifier | <div id="header"> |
| class | Group identifier | <div class="box"> |
| style | Inline styling | <p style="color:red"> |
Global Attributes
Global attributes can be used on any HTML element.
| Attribute | Purpose |
|---|---|
| id | Unique element identifier |
| class | CSS/JS grouping |
| style | Inline CSS |
| title | Tooltip text |
| hidden | Hide element |
Boolean Attributes
Boolean attributes do not require a value. Their presence alone applies the effect.
HTMLRead-only
1
Custom Data Attributes
Custom attributes starting with data- allow storing extra data.
HTMLRead-only
1
Multiple Attributes Example
HTMLRead-only
1
Best Practices
- Always use quotes for attribute values
- Use meaningful class and id names
- Avoid inline styles when possible
- Use alt attribute for accessibility
- Keep attributes clean and minimal
Conclusion
HTML attributes enhance elements by adding extra functionality and information. Understanding attributes is essential for styling, scripting, and building dynamic web applications.