CSS [AttributeName|=AttributeValue] Selector

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

• This selector specifies an element where the specified attribute is either equal to a specific value or begins with a specific value followed by a hyphen (-). In the following example, the color property will be set to red for any <p> element whose lang attribute is equal to en or begins with en-. The style is NOT applied to the third <p> element.

CSS Example:

  p[lang|=en] {color: red;}

  <p lang="en">The red style has been applied to this element.</p>
  <p lang="en-au">The red style has been applied to this element.</p>
  <p lang="fr">The red style has not been applied to this element.</p>