Whitespace [~=] Attribute Selector

Whitespace [~=] attribute selector

Exactly matches the specified attribute value in a space-delimited list of values.

CSS 2.1, Section 5.8.1



[att~=val] {...}



Must be either an Identifier or a String.


Must be either an Identifier or a String.

Standards information


Note  Requires Windows Internet Explorer 7 or later.
Note  Attribute selectors are not supported in webpages that are displayed in the Microsoft Internet Explorer 5 document mode (also known as "Quirks" mode). To use attribute selectors, add a !DOCTYPE directive that specifies a standards-based document. For more information, see Defining Document Compatibility.

Attributes are case-sensitive.

If the target val contains whitespace, the rule will not match anything.


The following style rule selects any element with an "attr" attribute whose value contains a whitespace-delimited list of words, one of which is the token "Two".

<!DOCTYPE html>
    <style type="text/css">
      .test         { display:none; }
      [attr~="Two"] { display:block; }
    <div class="test" attr="One Two Three">Test for [~=] (Whitespace) succeeded.</div>

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/css/attr_selectors.htm



© 2015 Microsoft