Errore con la proprietà CSS sconosciuta: filter, opacity e trasparenza

Scritto il 16 Maggio 2008
Nella categoria Guide | Scrivi un commento
Tag: , , , , , ,

In molti siti mi è capitato di vedere, grazie a Firebug ma anche nella console degli errori, un errore ricorrente, la scritta:

Proprieta filter

Si tratta di una proprietà CSS gestita solo da Internet Explorer, documentata su MSDN, che Firefox non riesce ad interpretare perché non standard ma esclusiva del browser di casa Microsoft.

Solitamente viene utilizzata dai siti per creare delle trasparenze, specificando come filtro l’opacità, ma anche qui siamo fuori standard. La modalità corretta per impostare una opacità (che in pratica sarebbe una trasparenza) è la proprietà opacity, come specificato dal CSS3.

Testo Normale
Questo è trasparente
Un po’ meno

Fonte dell’immagine jmcarthy99

In questo box sopra alcune scritte sono trasparenti praticamente per tutti i browser moderni: Firefox 2 (e 3), Opera 9 e Safari (da 1.3), rimane escluso Internet Explorer (non ho provato la 8, ma sembra di no) ed è quindi il metodo giusto di fare le cose.

Riassunto:

Standard: opacity: 0.6;

Internet Explorer: filter: alpha(opacity=60);