What are HTML attributes, and how are they used? With simple examples

In HTML, on the opening tag of an element, we can place attributes.

Attributes provide details about an element or specify how it works.

Here is the basic syntax for an attribute.

The basic syntax for an attribute.
(click on the image to open in a new tab)

The attribute value may be a string or a number depending on the different types of attributes.

Attribute values can be strings or numbers
(click on the image to open in a new tab)

Boolean Attributes

A few attributes, including the “checked” attribute (example below), have a slightly different syntax.

The ‘checked’ attribute dosn’t have a value.
(click on the image to open in a new tab)

In the above example we the code of a preselected checkbox.

We use the checked attribute to pre-select it.

A preselected checkbox.

The checked attribute does not require a value.

When the checked attribute is present in the element, the checkbox is checked by default, and if not, it remains unchecked.

We call this a boolean attribute.

In HTML, other frequently used boolean attributes are “disabled” and “required”.

These attributes define the state of an element. And that state can be either True or False, thus we call them boolean.

Wrapping Up

HTML uses numerous attributes to control how elements look and behave on a webpage.

Understanding attributes is key to building interactive, accessible websites.

Although my blog doesn’t support comments, feel free to reply via email or X.

Privacy Policy Lambros Hatzinikolaou © 2024 — Today. All rights reserved.