网上有很多关于ie hack的文章,可能由于文章发布后ie的版本还在升级。所以导致有些hack写法已经不适用了。以下是本人整理的ie6-11的一些hack常用写法。(以下默认文档模式为标准模式)

1.通过条件判断ie版本来引用不同的css

<!--[if IE]>只试用ie浏览器<![endif]-->
<!--[if !IE]>只试用非ie浏览器<![endif]-->
<!--[if IE 6]>只试用ie6浏览器<![endif]-->
<!--[if gt IE 6]>只试用大于ie6浏览器<![endif]-->
<!--[if lt IE 9]>只试用小于ie9浏览器 <![endif]--> 
<!--[if gte IE 8]>只试用大于或等于ie8浏览器<![endif]--> 
<!--[if lte IE 7]>只试用小于或等于ie7浏览器<![endif]-->

以上方式以此类推,可以通过引用不同的外链css或直接使用内嵌样式表 来满足基本要求。

2.直接使用css属性的hack写法。

1)!important  由于ie6不知别!important,其他浏览器都识别,所以可以用于ie6 hack。

div{
max-width:100px;
width:auto !important;
width:100px;
}

2)  下划线 '_'   ie6的有一个专用hack写法。

div{
color:blue;
_color:red;  /*只有在ie6下才会表现为红色*/
}

3) 星号 '*'  ie6,7的公用写法。  

div{
color:blue;
*color:red; /*在ie6,7下都会表现为红色*/
}

ie7没有专用写法,*会同时识别ie6,7,如果只想识别ie7,可以同时配合下划线‘_’使用。  

4) \0   ie8及以上浏览器都会识别\0写法,ie6,7不识别

div{
color:red;
color:#ccc\0;
}

以上写法只有ie8及以上浏览器都会识别,ie6,7不识别,而且会导致ie6,7不识别普通写法(color:red),需要同时使用'*'来适配ie6,7。

5)\9   ie6-10都识别\9,10以上不识别

div{
color:red;
color:blue\9; /*ie 6-10都为blue*/
} 

6)\9\0  ie9,10识别   ie8,11不识别,使用默认    ie6,7不识别,也不使用默认

div{
color:red;
color:blue\9\0;
}

以上写法在ie9,10中会表现会蓝色,在ie8,11下会表现为红色,而在ie6,7下则表现为黑色,需要单独为ie6,7使用 '*' hack。

以上就是总结的ie hack写法,代码和例子均测试过。欢迎大家补充,分享。

最后说一句,如果可以通过其他方式避免ie不同版本表现不一致,尽量不要使用hack写法。

  

css ie hack整理的更多相关文章

  1. css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器

    css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器 2013年03月24日 ⁄ CSS ⁄ 共 716字 ⁄ 暂无评论         前端开发最要命的事就是处理浏览器的兼容性问 ...

  2. css常用hack

    原文地址:css常用hack 突然想起今天早上在CNZZ看到的统计数据,使用IE6.7的用户比例还真多,看到之后我的心都碎了.微软都放弃了为毛还有这么多人不死心? 所以说,IE下的兼容还是得做的. – ...

  3. 【必备】史上最全的浏览器 CSS & JS Hack 手册(转)

    浏览器渲染页面的方式各不相同,甚至同一浏览器的不同版本(“杰出代表”是 IE)也有差异.因此,浏览器兼容成为前端开发人员的必备技能.如果有一份浏览器 Hack 手册,那查询起来就方便多了.这篇文章就向 ...

  4. css if hack之兼容ie

    1.Css if hack条件语法< !--[if IE]> Only IE <![endif]-->仅所有的WIN系统自带IE可识别< !--[if IE 5.0]&g ...

  5. 最新区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法和Css if hack条件语法操作说明

    自从安装了IE8.0正式版本!木头 就对基本的几个 CSS HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助! 本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象 ...

  6. CSS小tip整理

    CSS小tip整理 1.利用css在列表靠头和末尾添加箭头: /* 左箭头*/ ol a[rel="prev"]:before { content: "\00AB&quo ...

  7. 针对IE的CSS样式hack

    针对IE的CSS样式hack,如下: 例子:background:#000: 1.只针对IE6的hack方式(_):_background:#000: 2.只针对IE7的hack方式(+):+back ...

  8. 关于css的hack问题

    <!--[if <keywords>? IE <version>?]> HTML代码块 <![endif]--> 取值: <keywords> ...

  9. CSS样式命名整理(非原创)

    非原创,具体出自哪里忘了,如果侵害您的利益,请联系我. CSS样式命名整理 页面结构 容器: container/wrap 整体宽度:wrapper 页头:header 内容:content 页面主体 ...

随机推荐

  1. 在jQuery.getData中renderCallback使用不同创建方式的结果

    JavaScript 中需要创建函数的话,有两种方法:函数声明.函数表达式,各自写法如下:// 方法一:函数声明function foo() {}// 方法二:函数表达式var foo = funct ...

  2. 探究Android SQLite3多线程

    最近做项目时在多线程读写数据库时抛出了异常,这自然是我对SQlite3有理解不到位的地方,所以事后仔细探究了一番. 关于getWriteableDataBase()和getReadableDataba ...

  3. UVA - 11346 Probability (概率)

    Description Probability Time Limit: 1 sec  Memory Limit: 16MB Consider rectangular coordinate system ...

  4. Oracle开启归档

    #查看数据库是否为归档模式select name ,log_mode from v$database; #改变归档模式到非归档模式shutdown normal/immediate; #关闭数据库st ...

  5. FileUpload 改变控件显示的文字

    浏览

  6. Facebook 开源 AI 所使用的硬件平台 'Big Sur'

    Facebook 开源 AI 所使用的硬件平台 'Big Sur' Facebook 今开源其 AI 所使用的硬件平台 'Big Sur'.'Big Sur' 是兼容开放机架的 GPU 加速硬件平台. ...

  7. lr 自带的例子,如何进行关联,通过代码的函数进行实现

    本篇主要介绍如何来进行把参数进行关联,首先对web tours进行设定 如下图 点击“administration”j进入跳转页面,如下图所示 勾选第三项,下拉下方,点击“update”按钮, 关闭浏 ...

  8. Intellij IDEA 14隐藏被排除的文件夹

    被排除的文件和文件夹以红色显示了. 看着这东西,人一下子就不好了. 还好设置可以改回来. Project tab右上角齿轮,关闭“Show Excluded Files”即可.

  9. .net 安装remoting服务

    程序->vs2008->vs tools->vs2008 命令提示 D:\QidianWorkShop\Develop\Source\Services\Snda.Qidian.Hon ...

  10. I - Tunnel Warfare - hdu 1540(区间合并更新)

    题意:在抗日战争期间,地道战在华北平原得到广泛的实施,一般而言,村庄通过一些隧道在一条线上连接,除了两端剩下的每个村庄都有两个相连. 侵略者会频繁的对这些村庄进行扫荡,并且摧他们的地道,当然八路军会把 ...