条件CSS的高级用法

作者佚名技术来源 CSS技术浏览发布时间 2012-03-03

过确保IE并且只有IE可以获得IE特定的CSS是可行的。要做到这些我们需要使用IE的条件注释并结合条件CSS能够使用GET变量获取浏览器信息的能力。条件CSS 接受浏览器的两个不同变量：

b - 浏览器名称
v - 浏览器版本(可选)

下面的这个例子显示使用条件注释声明的HTML需要确定IE6和IE7将获取它们的特定颜色，而其它的所有浏览器将获取其它样式:

<!--[if !IE]><!-->
  <style type="text/css">@import ''/media/css/c-css.php?b=nonIE'';</style>
<!--<![endif]-->
<!--[if IE 6]>
  <style type="text/css">@import ''/media/css/ic-css.php?b=IE&v=6'';</style>
<![endif]-->
<!--[if gte IE 7]>
  <style type="text/css">@import ''/media/css/c-css.php?b=IE&v=7'';</style>
<![endif]-->

使用静态CSS文件

使用条件CSS为每一个浏览器生成一个定制的CSS文件的方法看起来很不错，它只是十分适用于管理一个相对比较轻量级的网站，因为程序必须运行于样式的每一个请求。对于中到大型网站，这的确不太合适，特别是当创建的文件数量受到限制的时候。所以条件语句有接受命令行参数的能力，它可以指定某个浏览器和版本(可选)应该生效然后输出最终样式到标准输出文件。下面的脚本可以用于为IE6/7以及非IE浏览器生成CSS文件(注意，该脚本描述了PHP版本的条件CSS，但是命令行选项和C版本一样)：

#!/bin/sh
php -q c-css.php IE 7 > ie7.css
php -q c-css.php IE 6 > ie6.css
php -q c-css.php > nonie.css

公平的说，这是你需要的最合适的样式组合。因此，下面的使用HTML注释可以配合上面的脚本来调用需求的CSS文件。

<!--[if !IE]><!-->
  <style type="text/css">@import ''/media/css/nonie.css'';</style>
<!--<![endif]-->
<!--[if IE 6]>
  <style type="text/css">@import ''/media/css/ie6.css'';</style>
<![endif]-->
<!--[if gte IE 7]>
  <style type="text/css">@import ''/media/css/ie7.css'';</style>
<![endif]-->

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

分享到：更多

你可能对下面的文章感兴趣

上一篇: CSS代码优化7个准则下一篇: CSS教程(2)：通过实例学习CSS背景

关于条件CSS的高级用法的所有评论

随机推荐