一般情况下的浏览器兼容需要考虑 IE6/7/8 三种 IE 版本，当然在 IE9 开始逐步推向市场后，又会有更多的衍生版本。所以我目前只考虑 IE7~9 版本的兼容情况。涉及到的条件注释代码如下：

<!DOCTYPE html>

<!--[if lt IE 7 ]><html><![endif]-->

<!--[if IE 7 ]><html><![endif]-->

<!--[if IE 8 ]><html><![endif]-->

<!--[if IE 9 ]><html><![endif]-->

<!--[if (gt IE 9)|!(IE)]><!--><html><!--<![endif]-->

使用说明如下：

.test {

    /* 针对非 ie 浏览器的样式 */

}

.ie .test {

    /* 针对所有 ie 版本的样式 */

}

.ie6 .test {

    /* 针对 ie6 的样式 */

}

...

.ie9 .test {

    /* 针对 ie9 的样式 */

}

之前那篇文章里也有同学提出通过 PHP 判断 UA 参数并动态输出样式表的方法，这个虽然是简洁明了，但和后端代码耦合在一起，总觉得不是一回事。况且实际应用中很多情况下会将页面模板化，做动态输出并不非常适合。

另外，国内各大双核高速安全的壳浏览器还没有经过测试，这个需要再做了解。

原文：http://www.mangguo.org/after-abandoning-css-hacks-browser-compatible-solution/

抛弃 CSS Hacks 后的浏览器兼容方案的更多相关文章

  1. 转：【总结】浏览器CSS Hacks汇总，浏览器兼容方式CSS Hacks

    [总结]浏览器CSS Hacks汇总   浏览器兼容可以说是前端开发所要面对的第一个挑战,目前我的电脑上已经安装了6种浏览器(基于IE内核的不算,如Maxthon等). CSS hacks利用浏览器的 ...

  2. 怎么用css hack处理各浏览器兼容IE6，IE7,IE8,IE9/ FF

    第一:什么事浏览器兼容性 浏览器兼容性问题又被称为网页兼容性或网站兼容性问题,指网页在各种浏览器上的显示效果可能不一致而产生浏览器和网页间的兼容问题.在网站的设计和制作中,做好浏览器兼容,才能够让网站 ...

  3. HTML5全屏浏览器兼容方案

    最近一个项目有页面全屏的的需求,搜索了下有HTML5的全屏API可用,不过各浏览器的支持不一样. 标准 webkit  Firefox  IE Element.requestFullscreen() ...

  4. IE浏览器兼容方案

    1.使用高版本渲染模式 <meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″/> 2.css hack (1)条件注释 ...

  5. jQuery-1.9.1源码分析系列（七） 钩子（hooks）机制及浏览器兼容

    处理浏览器兼容问题实际上不是jQuery的精髓,毕竟让技术员想方设法取弥补浏览器的过错从而使得代码乱七八糟不是个好事.一些特殊情况的处理,完全实在浪费浏览器的性能:突兀的兼容解决使得的代码看起来既不美 ...

  6. CSS3与页面布局学习总结（八）——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  7. HTML5前端性能优化——浏览器兼容与前端性能优化

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  8. 【CSS学习笔记】初始化CSS后，写li，并利用背景图片，来完成li小图标的效果，且达到个浏览器兼容

    第一种情况 /*当标题前的图标时单独的一个点儿或者方块或者其他类似图标时,定义背景图background要放在<li>里.    在<li>中设置背景图片的尺寸,地址,不重复, ...

  9. CSS在不同浏览器兼容问题,margin偏移/offset溢出等

    margin在垂直取值时取最大值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

随机推荐

  1. QM课程01-功能概述

    QM模块满足一个 CIQ 系统的下列功能: 一般功能 · 在物料主记录中集成QM检验数据 · 管理供应商和客户或销售部门的物料相关的质量信息 · 把质量特性和物料说明中的检验特性连接 · 管理中央凭证 ...

  2. Codeforces Round #332 (Div. 2) D. Spongebob and Squares 数学题枚举

    D. Spongebob and Squares Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/ ...

  3. Python学习 之 内建函数

    1.常用函数:abs().max().min().len().divmod().pow().round() 例1:abs返回数字绝对值 abs(10) #结果10 abs(-10) #结果10 例2: ...

  4. C语言的ANSI/ISO标准

    摘自:http://see.xidian.edu.cn/cpp/html/1658.html 从技术上讲有两种C语言标准,一种来自ANSI(American National Standard Ins ...

  5. iOS UIButton加在window上点击无效果问题

    UIButton加在window上,点击没有效果,找了很久,原来是没有加上这名:[self.window makeKeyAndVisible]; self.window = [[UIWindow al ...

  6. Hidden Markov Model

    Markov Chain 马尔科夫链(Markov chain)是一个具有马氏性的随机过程,其时间和状态参数都是离散的.马尔科夫链可用于描述系统在状态空间中的各种状态之间的转移情况,其中下一个状态仅依 ...

  7. 我的第一款Cocos2d 游戏小狗快跑基本完成

  8. css笔记07：通配符选择器

    通配符选择器: * { margin:10px ;//默认四个位置参数全为零 margin-top:10px;//分别设置四个参数 margin-left:10px; margin-right:0px ...

  9. JS 控制文本框只能输入中文、英文、数字与指定特殊符号

    想做姓名输入的js判断是否是中文,但是网上找的很多是源于一篇文章的,判断中文的正则式不对,后来找到一个可以准确判断了,但是是监测里面有中文的就行,跟我想要的只能输入中文的意思相左,所以又找了下面的 J ...

  10. [改善Java代码]让工具类不可实例化

    建议42: 让工具类不可实例化 Java项目中使用的工具类非常多,比如JDK自己的工具类java.lang.Math.java.util.Collections等都是我们经常用到的.工具类的方法和属性 ...