Links and attributes

Attributes

Add information to an element with attributes and understand quoted values, boolean attributes, classes, and unique IDs.

7 minute lesson

~~~

Attributes add information to an element. They are written in the opening tag.

<p class="introduction">Welcome to the guide.</p>

Here, class is the attribute name and introduction is its value.

An element can have several attributes:

<p id="welcome" class="introduction featured">
  Welcome to the guide.
</p>

Quote attribute values. Double quotes are the common convention.

The class attribute can contain several space-separated names. You can reuse those names on many elements. CSS and JavaScript often use classes to find related elements.

An id identifies one element in the document. Keep every ID unique.

Some attributes are boolean. Their presence means true:

<button disabled>Save</button>

You will meet element-specific attributes throughout this course: href on links, src and alt on images, and many more.

Attributes describe or configure an element. They do not replace its content. A link still needs useful link text, and an image still needs a useful text alternative when it conveys information.

Lesson completed