This page is In Progress

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

Attribute selector

Summary

Allows to select tags that has an attributes. While it can match the class and the id selector, its specificity value is lower.

Syntax

[sel=att] {...}

Parameters

  • sel: The name of a tag property
  • att: Must be either an Identifier or a String.
  • "=": An equality expression, one of
    • = Exactly equals,
    • ^= Begins with,
    • $= Ends with,
    • ~= Contains (with word boundary),
    • *= Contains (without word boundary)

Examples

The following style rule selects any element with an “attr” attribute whose value is exactly "Value".

<!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
      .test          { display:none; }
      [attr="Value"] { display:block; }
    </style>
  </head>
  <body>
    <div class="test" attr="Value">Test for [=] (Value) succeeded.</div>
  </body>
</html>

Related specifications

Selectors Level 3
W3C Recommendation

See also

Related articles

CSS Attributes

Selectors

Attributions