使用CSS前缀,可以解决不同浏览器对于CSS Media查询的支持不同的问题。下面是一个例子,使用前缀在不同浏览器上获得正确的结果:
@media screen and (-webkit-min-device-pixel-ratio:0) { /* Safari and Chrome / } @media screen and (-o-min-device-pixel-ratio:0/1) { / Opera / } @media screen and (min-resolution: 192dpi) { / Retina devices / } @media screen and (min-device-width: 1200px) { / Desktops and laptops*/ } @media screen and (max-device-width: 480px) { /* Mobile devices */ }
上一篇:不同浏览器间的边框图片切片差异
下一篇:不同浏览器上的不同占位符