O seguinte é dos documentos da Adobe .
A especificação de consultas de mídia também fornece a palavra-chave only
, cujo objetivo é ocultar consultas de mídia de navegadores mais antigos. Assim not
, a palavra-chave deve vir no início da declaração. Por exemplo:
media="only screen and (min-width: 401px) and (max-width: 600px)"
Os navegadores que não reconhecem consultas de mídia esperam uma lista de tipos de mídia separados por vírgula, e a especificação diz que eles devem truncar cada valor imediatamente antes do primeiro caractere não alfanumérico que não é um hífen. Portanto, um navegador antigo deve interpretar o exemplo anterior como este:
media="only"
Como não existe apenas um tipo de mídia, a folha de estilo é ignorada. Da mesma forma, um navegador antigo deve interpretar
media="screen and (min-width: 401px) and (max-width: 600px)"
Como
media="screen"
Em outras palavras, deve aplicar as regras de estilo a todos os dispositivos de tela, mesmo que não saiba o que as consultas de mídia significam.
Infelizmente, o IE 6–8 falhou ao implementar a especificação corretamente.
Em vez de aplicar os estilos a todos os dispositivos de tela, ele ignora completamente a folha de estilos.
Apesar desse comportamento, ainda é recomendável prefixar as consultas de mídia apenas se você quiser ocultar os estilos de outros navegadores menos comuns.
Então, usando
media="only screen and (min-width: 401px)"
e
media="screen and (min-width: 401px)"
terá o mesmo efeito no IE6-8: ambos impedirão que esses estilos sejam usados. No entanto, eles ainda serão baixados.
Além disso, em navegadores que suportam consultas de mídia CSS3, ambas as versões carregam os estilos se a largura da janela de exibição for maior que 401px
e o tipo de mídia for tela.
Não tenho certeza de quais navegadores que não suportam consultas de mídia CSS3 precisariam da only
versão
media="only screen and (min-width: 401px)"
em oposição a
media="screen and (min-width: 401px)"
para garantir que não seja interpretado como
media="screen"
Seria um bom teste para alguém com acesso a um laboratório de dispositivos.
only
palavra - chave oculta folhas de estilo de navegadores mais antigos, consulte a resposta @hybrid abaixo. Ele explica muito bem.