Explanation: This CSS selector (attribute) allows you to style elements which have the appropriate attribute. Although this capability has been around since CSS-2.1, it is enhanced in CSS-3.
In CSS-2.1 one could test for
- a given attribute ( as in a[href] )
- a specific value ( as in a[href=”index.html’] )
- or, a match to a word ( as in img[alt=”small”] )
In CSS-3 one can now also test for
- a starting value ( as in a[href^=”http://”] )
- an ending value ( as in a[href$=”.zip”] )
- or, a value anywhere within a string ( as in div[id*=”wrapper”] )
Example CSS code:
a[href^=”http://”] {
font-weight:bold;
}
In the above example, only links to external pages are highlighted in bold.
Example page (view the source code): http://learning-html5.info/CSS3/CSS3_AttributeSelector.html (should work in most modern browsers).
References: