是这一段：
<link rel="stylesheet" href="/2008/site/css/minimum" type="text/css" media="handheld, all" />
<style type="text/css" media="print, screen and (min-width: 481px)">
/*<![CDATA[*/
@import url("/2008/site/css/advanced");
/*]]>*/
</style>
<link href="/2008/site/css/minimum" rel="stylesheet" type="text/css" media="handheld, only screen and (max-device-width: 480px)" />
第一，既然有 all ，前面再加个 handheld 有必要么？
第二，为什么第二句要用这种形式，而不是和其他两句一样直接 <link> ?
第三，既然第三句引入的 CSS 文件和第一句相同，而且第一句的 media 设置成了 all ，那么第三句还有必要么？
<link rel="stylesheet" href="/2008/site/css/minimum" type="text/css" media="handheld, all" />
<style type="text/css" media="print, screen and (min-width: 481px)">
/*<![CDATA[*/
@import url("/2008/site/css/advanced");
/*]]>*/
</style>
<link href="/2008/site/css/minimum" rel="stylesheet" type="text/css" media="handheld, only screen and (max-device-width: 480px)" />
第一，既然有 all ，前面再加个 handheld 有必要么？
第二，为什么第二句要用这种形式，而不是和其他两句一样直接 <link> ?
第三，既然第三句引入的 CSS 文件和第一句相同，而且第一句的 media 设置成了 all ，那么第三句还有必要么？
8 条回复 • 1970-01-01 08:00:00 +08:00
 |
1
gonghao 2011 年 2 月 25 日
坐等规范解读、理解高手解释~
|
 |
2
manhere 2011 年 2 月 25 日
实现按需下载css文件，避免浪费手持设备带宽
|
|
3
manhere 2011 年 2 月 25 日
参见CSS手册：Media Queries
|
 |
4
dimlau OP @manhere 呃……我是说第一条的 media 值是 all ，当然也包括手持设备了吧，然后第三条又专门针对手持设备重写了一次引用。既然两次引用的文件是相同的，是不是浪费？
顺便又来了问题。如果第一句和第三句引用的是不同文件。设备会不会根据先后顺序预先判断 CSS 先后顺序造成的覆盖情况，从而实现忽略前边那个 media 值是 all 的文件而只加载第三条引用的 CSS ？ |
 |
5
fireyy 2011 年 2 月 25 日
第一个是为了应付opera mini的特殊情况，它有个"fit to screen"的功能，默认情况一般是开启的，这样如果只设置all，它会忽略你的css，所以要额外在前面加一个handheld
第二个是因为某些浏览器不支持@import 或者 min-width，所以可以用这一点忽略一些不支持的浏览器 第三个是 为了安全起见，当出现一些手持浏览器都支持前两条规则，但是我们又不想它应用/2008/site/css/advanced样式的时候，我们再用2008/site/css/minimum覆盖advanced的某些样式 |
|
7
dimlau OP |