CSS Attribute Selectors
It is possible to style HTML elements that have specific attributes or attribute values.
Basic Attribute Selector
The [attribute] selector is used to select elements with a specified attribute, regardless of its value.
Example: Selects all <a> elements with a target attribute
css
a[target] {
background-color: yellow;
}Attribute with Specific Value Selector
The [attribute="value"] selector is used to select elements with a specified attribute and value.
Example: Selects all <a> elements with target="_blank"
css
a[target="_blank"] {
background-color: yellow;
}Attribute Contains Value Selector
The [attribute~="value"] selector is used to select elements with an attribute value containing a specified word.
Example: Selects all elements with a title attribute containing "flower"
css
[title~="flower"] {
border: 5px solid yellow;
}Test Yourself with an Exercise
Which selector targets all <a> elements with a `target` attribute set to `_blank`?