HTML Attributes

A reference to common HTML attributes and how they add additional information to elements.

On this page

A reference to common HTML attributes and how they add additional information to elements.

Attributes add extra information to an element. They are written in the start tag and commonly use a name="value" format.

Attribute Basics

<element attribute="value">...</element>

The href attribute sets the target URL for a link.

<a href="https://example.com">Read the docs</a>

The src attribute sets the source URL for media such as images.

<img src="logo.png" alt="Site logo">

Use relative URLs for assets you host yourself. Use absolute URLs for external resources.

<img src="images/banner.png" alt="Banner">
<img src="https://example.com/banner.png" alt="Banner">

For images, width and height define the display size in pixels.

<img src="landscape.jpg" alt="Landscape" width="600" height="400">

The alt text is used when an image cannot be displayed and is read by screen readers.

<img src="team.jpg" alt="Our team standing in front of the office">

The style attribute applies inline CSS. Prefer external CSS for reusable styling.

<p style="color: red;">This text is red.</p>

The lang attribute on the html element declares the document language.

<html lang="en">

The title attribute adds advisory text, often shown as a tooltip on hover.

<button title="Save">Save</button>

Use lowercase attribute names and quote attribute values for consistency and readability.

<a href="/about">About</a>
<a HREF=/about>About</a>