Lesson 3: HTML Attributes

What are HTML Attributes?

HTML attributes provide additional information about HTML elements. Attributes are always specified in the start tag and usually come in name/value pairs like: name="value"

<a href="https://www.example.com">Visit Example</a>
<img src="image.jpg" alt="Description">

Common HTML Attributes

Attribute Description Example
href Specifies the URL for a link <a href="url">
src Specifies the source file for an image <img src="image.jpg">
alt Alternative text for an image <img alt="description">
width & height Specifies dimensions <img width="100" height="100">
id Unique identifier for an element <div id="header">
class Specifies one or more class names <p class="intro">
style Specifies inline CSS styles <p style="color:red">
title Extra information (tooltip) <p title="Tooltip">

The lang Attribute

The language of the document can be declared in the <html> tag. This is important for accessibility and search engines:

<html lang="en">
Best Practices:

Examples with Multiple Attributes

<img src="logo.png" alt="Company Logo" width="200" height="100">

<a href="contact.html" title="Go to contact page" class="nav-link">
    Contact Us
</a>

<p id="intro" class="highlight" style="font-size: 18px;">
    Welcome to our website!
</p>