CSS [attribute~="value"] selector selects all the elements from a page that have a given word in their attribute value. This selector is generally used for the title and alt attributes.
The [attribute~=”value”] selector given in the example below selects all the <img> elements that have the word 'round' in their alt attribute and sets their border radius to 50%. Try it out:
Example:
img[alt~="round"]{
border-radius: 50%;
}
Select all the <a> elements that have word 'internal' in their title attribute and set their background color to yellow.
Example:
a[title~="internal"]{
background: yellow;
}
CSS Syntax
The [attribute~=”value”] selector selector has the following syntax:
[attribute~="value"]{
CSS styles
}
Related Pages
CSS Tutorials: CSS Attribute Selectors
