CSS媒体查询简介(2)

在上述所有情况下,当当前浏览器窗口为480px或更低时,相应的样式表将仅在浏览器中应用, 并且  仅在浏览器支持CSS媒体查询时才应用。后来的不明确的条件是由于我们 only 在媒体查询中使用“ ” - 更多内容如下。

 浏览器支持CSS媒体查询

浏览器对CSS媒体查询的支持没有什么值得沮丧的,几乎所有的移动浏览器都存在于当前和过去,对于桌面浏览器,至少是当前这一代:

CSS媒体查询支持 FF IE 苹果浏览器 歌剧 iOS Safari Opera Mobile Android浏览器

3.5+ 9+ 所有已知版本 4+ 9.5+ 3.2+ 10+ 2.1+

在移动设备上,CSS媒体查询真正节省了设计移动兼容网页的那一天,它得到了全面支持。

重要的是要注意,虽然CSS媒体查询仅在更现代的浏览器中受支持,但 @media 规则本身(没有媒体查询部分)被更大的集合(例如IE6)识别。它们都支持CSS媒体类型 @media 形式 的更基本版本,允许您将CSS限制在特定媒体上,例如仅在打印页面时应用CSS。当您开始将CSS媒体查询添加到旧版浏览器将不再识别的规则时。请考虑以下示例:  @media print @media

<! - 此样式表由所有已知浏览器下载和呈现,包括IE5,6,7等 - > 
media =“screen “  />

<! - 此样式表由支持CSS媒体查询的浏览器下载和呈现,因为存在“仅” - > 
media =“只有屏幕”  />

<! - 此样式表由支持CSS媒体查询的浏览器下载和呈现,因为存在“和(最小宽度:800px)” - > 
media =“screen and(min-width:800px)”  />

来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/69933200/viewspace-2651738/,如需转载,请注明出处,否则将追究法律责任。

转载于:http://blog.itpub.net/69933200/viewspace-2651738/

你可能感兴趣的:(CSS媒体查询简介(2))