Selettori di attributo CSS e gestione delle immagini

Tante volte si guarda ai CSS e alla loro evoluzione solo in vista della possibilità  di applicare questo e quell’effetto visivo. E si dimentica quanto utili e potenti possano essere aspetti del linguaggio come i selettori avanzati. Certo, anche su questo punto non mancano le voci di quanti vorrebbero di più, ma con quello che si ha a disposizione già  oggi molto si può fare.

Andy Clark, ad esempio, spiega come un uso accorto dei selettori di attributo possa in certi scenari tornare vantaggioso nella gestione delle immagini e della loro presentazione. Gli scenari proposti spaziano dalla possibilità  di applicare regole ad hoc alle immagini provenienti da un certo sito esterno a quella di formattare in modi specifici quelle contenute in una certa cartella del sito:

<img src="thumbnails/promo-main-css.png" alt="" />



img[src*="thumbnails"] {

/* Styles */ }

I selettori di attributo usati negli esempi (rintracciano la presenza di una certa sottostringa nel valore dell’attributo) non sono parte della specifica CSS2, ma sono un’aggiunta introdotta nel modulo per i selettori dei CSS3.

No, IE6 non li supporta :)