一般情况下的浏览器兼容需要考虑 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. javascript 笔记(待续)

    1.基础对象  var o=new Object();  o.xxx=1; o.xx=2;    var 01={xxx=1,xx=2} 2.==与===   "5"==5 Tru ...

  2. C加密解密

    /********************************************************* * des.h * 用户使用des算法头文件 * **************** ...

  3. mydumper原理3

    Mydumper介绍 Mydumper是一个针对MySQL和Drizzle的高性能多线程备份和恢复工具.开发人员主要来自MySQL,Facebook,SkySQL公司.目前已经在一些线上使用了Mydu ...

  4. 已知json类型根据类型封装集合

    1编写帮助类根绝url得到json public static string Post(string url) { string strURL = url; //创建一个HTTP请求 HttpWebR ...

  5. SQL Server压缩日志及数据库文件大小

    请按步骤进行,未进行前面的步骤时,请不要做后面的步骤,以免损坏你的数据库. 一般不建议做第4,6两步,第4步不安全,有可能损坏数据库或丢失数据.第6步如果日志达到上限,则以后的数据库处理会失败,在清理 ...

  6. php运行步骤解析

    2000年, PHP4.0发布的时候,引入了Zend Engine. Zend引擎把PHP代码的执行切分成两个阶段: 一. Zend Engine 解析PHP代码并生成二进制中间码Zend Opcod ...

  7. 初始tornado框架

    2.7版本的一个简单的框架 from wsgiref.simple_server import make_server def new(): return 'new' def index(): ret ...

  8. cocos2d-x lua 使用自定义消息EventCustom

    cocos2d-x lua 使用自定义消息EventCustom version: cocos2d-x 3.6 1.发送消息 -- post message -- event将会被传递给消息接收函数, ...

  9. html笔记02：html，body { ……}

    html,body { margin:0px; height:100%; } html元素可告知浏览器其自身是一个 HTML 文档.body 元素定义文档的主体.它包含文档的所有内容(比如文本.图像. ...

  10. linux-搜索

    grep显示文件中的匹配行     grep  参数  字符串  文件名 -c 输出匹配的行数 -v输出不匹配行 不加参数  :输出匹配的行 经常和管道符一起使用 eg:ps -ef|grep tom ...