要素の属性でマッチングをかけていくセレクタについて確認していきます。
a[href="foo"] 全体一致 「なし」
a[href^="foo"] 先頭部分一致「 ^」
a[href$="foo"] 末尾部分一致「$」
a[href*="foo"] 含まれている 「*」
CSS3
<style>
a[href="http://dotinstall.com"]{
color:red;
}
</style>
a[href="http://dotinstall.com"]{
color:red;
}
</style>
HTMLには
<ul>
<li><a href="http://dotinstall.com">dotinstall.com</a></li>
<li><a href="http://google.com">Google</a></li>
<li><a href="http://yahoo.co.jp">Yahoo!</a></li>
<li><a href="mailto:taguchi@dotinstall.com">mail me!</a></li>
</ul>
<li><a href="http://dotinstall.com">dotinstall.com</a></li>
<li><a href="http://google.com">Google</a></li>
<li><a href="http://yahoo.co.jp">Yahoo!</a></li>
<li><a href="mailto:taguchi@dotinstall.com">mail me!</a></li>
</ul>
という具合に記述すると、全体一致する部分が赤になります。
（←画像を某所からお借りしました）と表示されます。