CSS application: display different icons according to file type

Sometimes our blog often provides some resources for others to download, but in PJBlog, all download links are represented by only one icon. With the new CSS3 attribute selector, this new technology, we can display different icons according to the different types of downloaded files.

What we want to use here is
E [att$=value]{…}

Its meaning is used to select all elements E that end with a value. Then we can write like this:
a[href$='.torrent'] {
padding: 5px 20px 5px 0;
background: transparent url(icons/icon_torrent.gif) no-repeat center right;
}
a[href$='.vcard'] {
padding: 5px 20px 5px 0;
background: transparent url(icons/icon_vcard.gif) no-repeat center right;
}
a[href$='.exe'] {
padding: 5px 20px 5px 0;
background: transparent url(icons/icon_exe.gif) no-repeat center right;
}
a[href$='.dmg'], a[href$='.app'] {
padding: 5px 20px 5px 0;
background: transparent url(icons/icon_dmg.gif) no-repeat center right;
}