CSS [AttributeName~=AttributeValue] Selector

What is a CSS [AttributeName~=AttributeValue] Selector?

• Some attributes can be specified as a whitespace separated list. This selector specifies an element whose whitespace separated list contains a specific value. In the following example, the color property will be set to red for any <p> element where the word "sample" is one of the values contained within the whitespace separated list. The style is NOT applied to the third <p> element.

CSS Example:

  p[title~=sample] {color: red;}

  <p title="sample 1">The red style has been applied to this element.</p>
  <p title="sample 2">The red style has been applied to this element.</p>
  <p title="example 1">The red style has not been applied to this element.</p>