Quanto segue proviene dai documenti Adobe .
La specifica delle query multimediali fornisce anche la parola chiave only
, che ha lo scopo di nascondere le query multimediali dai browser meno recenti. Ad esempio not
, la parola chiave deve arrivare all'inizio della dichiarazione. Per esempio:
media="only screen and (min-width: 401px) and (max-width: 600px)"
I browser che non riconoscono le query multimediali si aspettano un elenco di tipi di media separati da virgola e la specifica dice che dovrebbero troncare ogni valore immediatamente prima del primo carattere non alfanumerico che non è un trattino. Quindi, un vecchio browser dovrebbe interpretare l'esempio precedente come questo:
media="only"
Poiché non esiste un tipo di supporto come solo, il foglio di stile viene ignorato. Allo stesso modo, un vecchio browser dovrebbe interpretare
media="screen and (min-width: 401px) and (max-width: 600px)"
come
media="screen"
In altre parole, dovrebbe applicare le regole di stile a tutti i dispositivi dello schermo, anche se non sa cosa significano le query multimediali.
Sfortunatamente, IE 6–8 non ha implementato correttamente le specifiche.
Invece di applicare gli stili a tutti i dispositivi dello schermo, ignora del tutto il foglio di stile.
Nonostante questo comportamento, si consiglia comunque di aggiungere il prefisso alle query multimediali solo se si desidera nascondere gli stili ad altri browser meno comuni.
Quindi, usando
media="only screen and (min-width: 401px)"
e
media="screen and (min-width: 401px)"
avrà lo stesso effetto in IE6-8: entrambi impediranno l'utilizzo di quegli stili. Saranno comunque ancora scaricati.
Inoltre, nei browser che supportano le query multimediali CSS3, entrambe le versioni caricheranno gli stili se la larghezza della finestra è maggiore di 401px
e il tipo di supporto è schermo.
Non sono del tutto sicuro di quali browser che non supportano le query multimediali CSS3 avrebbero bisogno della only
versione
media="only screen and (min-width: 401px)"
al contrario di
media="screen and (min-width: 401px)"
per assicurarsi che non sia interpretato come
media="screen"
Sarebbe un buon test per qualcuno con accesso a un laboratorio di dispositivi.
only
parola chiave nasconderà i fogli di stile dai browser più vecchi, vedere la risposta di @hybrid di seguito. Lo spiega molto bene.