CSS [attribute|="value"]
selector selects all the elements having their attribute value exactly same as the specified value or the attribute value starting from the specified value followed by a hyphen(-)
.
The [attribute|=”value”] selector in the example below selects all the <p>
elements having a class attribute equals to 'internal'
or the class attribute starting from the word 'internal'
followed by a hyphen(-)
and sets their background color to yellow.
Example:
p[class|="internal"]{ background: yellow; padding: 5px; }
Select all <img>
elements where the alt
attribute starts with word “nature” and set their border radius to 50%.
Example:
img[alt|="nature"]{ border-radius: 50%; }
CSS Syntax
The [attribute|="value"]
selector has the following syntax:
[attribute|="value"]{ CSS styles }
Related Pages
CSS Tutorials: CSS Attribute Selectors