CSS [Attribute] Selector

It is possible to style HTML elements that have specific attributes or attribute values. The [attribute] selector is used to select elements with a specified attribute. The following example selects all <a> elements with a target="_blank" attribute:

HTML file: Displayed by browser:
<style>
a[target=_blank] {
    background-color: yellow;
}
</style>
<body>
<p>Any links with target="_blank" gets a yellow background:</p>
<p><a href="http://www.w3schools.com">W3 Schools</a></p>
<p><a href="http://www.disney.com" target="_blank">Disney Website</a></p>
<p><a href="http://www.wikipedia.org" target="_top">Wikipedia</a></p>
<p><a href="http://www.thesaurus.com">Thesaurus</a></p>
<p><a href="http://www.411.com" target="_new">411 Directory</a></p>
<p><a href="http://www.bclc.com" target="_blank">BC Lottery</a></p>
</body>

Any links with target="_blank" gets a yellow background:

W3 Schools

Disney Website

Wikipedia

Thesaurus

411 Directory

BC Lottery


Back button Table of Contents Next button