CSS [attribute~=value] Selector

Complete CSS Reference Complete CSS Reference

Example

How to style elements, with a title attribute that contains the word "flower":

[title~=flower]
{
background-color:yellow;
}

Try it yourself »

Definition and Usage

The [attribute~=value] selector styles elements with the specified attribute containing the specified value.

Note: The value has to be a whole word, either alone (title="flower") or separated by white-space (title="plant flower klematis").

Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The [attribute~=value] selector is supported in all major browsers.

Note: For [attribute~=value] to work in IE, a <!DOCTYPE> must be declared.

CSS Version

The [attribute~=value] selector was first introduced in:

CSS 2

Related Pages

CSS tutorial: CSS Attribute Selectors

Complete CSS Reference Complete CSS Reference