css ie hack整理
网上有很多关于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整理的更多相关文章
- css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器
css hack整理:区别FF,IE8,IE7,IE6,SF,CH浏览器 2013年03月24日 ⁄ CSS ⁄ 共 716字 ⁄ 暂无评论 前端开发最要命的事就是处理浏览器的兼容性问 ...
- css常用hack
原文地址:css常用hack 突然想起今天早上在CNZZ看到的统计数据,使用IE6.7的用户比例还真多,看到之后我的心都碎了.微软都放弃了为毛还有这么多人不死心? 所以说,IE下的兼容还是得做的. – ...
- 【必备】史上最全的浏览器 CSS & JS Hack 手册(转)
浏览器渲染页面的方式各不相同,甚至同一浏览器的不同版本(“杰出代表”是 IE)也有差异.因此,浏览器兼容成为前端开发人员的必备技能.如果有一份浏览器 Hack 手册,那查询起来就方便多了.这篇文章就向 ...
- css if hack之兼容ie
1.Css if hack条件语法< !--[if IE]> Only IE <![endif]-->仅所有的WIN系统自带IE可识别< !--[if IE 5.0]&g ...
- 最新区分兼容IE6/IE7/IE8/IE9/FF的CSS HACK写法和Css if hack条件语法操作说明
自从安装了IE8.0正式版本!木头 就对基本的几个 CSS HACK的做一下归纳!希望对网页前端布局DIV+CSS的实施者有所帮助! 本文就主要以:IE6+IE7+IE8+IE9+FF为主要研究对象 ...
- CSS小tip整理
CSS小tip整理 1.利用css在列表靠头和末尾添加箭头: /* 左箭头*/ ol a[rel="prev"]:before { content: "\00AB&quo ...
- 针对IE的CSS样式hack
针对IE的CSS样式hack,如下: 例子:background:#000: 1.只针对IE6的hack方式(_):_background:#000: 2.只针对IE7的hack方式(+):+back ...
- 关于css的hack问题
<!--[if <keywords>? IE <version>?]> HTML代码块 <![endif]--> 取值: <keywords> ...
- CSS样式命名整理(非原创)
非原创,具体出自哪里忘了,如果侵害您的利益,请联系我. CSS样式命名整理 页面结构 容器: container/wrap 整体宽度:wrapper 页头:header 内容:content 页面主体 ...
随机推荐
- underscorejs-map学习
2.2 map 2.2.1 语法: _.map(list, iteratee, [context]) 2.2.2 说明: 对集合的每个成员依次进行某种操作,将返回的值依次存入一个新的数组.接收3个参数 ...
- 【jquery学习笔记】关于$(window),$("html,body").scroll()的在不同浏览器的不同反应
已经很几次碰到了这种问题, 例子: $(window).scroll(function(){ var num=$(window).scrollTop(); //之前的写法是$ ...
- 面向对象设计模式之Interpreter解释器模式(行为型)
动机:在软件构建过程中 ,如果某一特定领域的问题比较复杂,类似的模式不断重复出现,如果使用普通的编程方式来实现将面临非常频繁的变化.在这种情况下,将特定领域的问题表达为某种语法规则的句子,然后构建一个 ...
- MongoDB-固定集合 capped collection 操作 介绍
固定集合:capped collection 是性能出色的固定大小的集合,以LRU算法淘汰记录,自助维护集合中的对象的插入顺序,创建时预先制定大小,空间使用完,心对象取代旧的对象,保持最新的数据. 可 ...
- JQuery调用iframe父页面元素与方法
JQuery操作iframe父页面与子页面的元素与方法 下面简单使用Jquery来操作iframe的一些记录,这个使用纯JS也可以实现. 第一.在iframe中查找父页面元素的方法: $('#id', ...
- ppt画笔标记在哪里|ppt中画笔工具功能怎么用?
一.ppt中画笔工具功能在哪里? 这个画笔工具其实就相当于我们的一个标记工具,要实现标记功能首先将需要演示的PPT按住F5进入到放映状态,然后在右击ppt上的空白处就会弹出衣蛾对话框,在对话框中选择“ ...
- UVa 129 Krypton Factor困难的串 (dfs 递归搜索)
回溯法,只需要判断当前串的后缀,而不是所有的子串 #include<iostream> #include<cstdio> using namespace std; ]; int ...
- MySQL的索引
MySQL索引 索引:是一种特殊的文件(InnoDB 数据表上的索引是表空间的一个组成部分),它们包含着对数据表里所有记录的引用指针.其可以加快数据读操作,但会使数据写操作变慢:应该构建在被用作查询条 ...
- iOS开发之WKWebView简单使用
iOS开发之WKWebView简单使用 iOS开发之 WKWebVeiw使用 想用UIWebVeiw做的,但是突然想起来在iOS8中出了一个新的WKWebView,算是UIWebVeiw的升级版. ...
- Configure swagger with spring boot
If you haven’t starting working with spring boot yet, you will quickly find that it pulls out all th ...