The attribute selector is a fantastic tool. A simple example of their benefit is when styling forms. Say you have this:

<input type="text">
<input type="submit">

You can style each element uniquely by doing this:

input[type="text"] { border: 1px inset #CCC; background: #FFF; }
input[type="submit"] { border: 1px outset #CCC; background: #CCC; }

You can also create a unique hover effect:

input[type="submit"]:hover { border-style: solid; background: #CFC; }

The same logic can be used to add an image after offsite links (assuming insite links are root relative):

<a href="http:///www.example.com/" rel="external">

a[href^="http"]:after { content: url("offsiteImg.gif"; }

or

a[rel="external"]:after { content: url("offsiteImg.gif"; }

Doing this without the attribute selector means using classes, which tends to pollute the mark-up. Unfortunately, Internet Explorer on Windows and Netscape 4.x don’t support attribute selectors.