文档章节

CSS HACK

sheilacat
 sheilacat
发布于 2015/03/12 21:07
字数 461
阅读 27
收藏 0

CSS hack分类

CSS Hack大致有3种表现形式,CSS属性前缀法、选择器前缀法以及IE条件注释法(即HTML头部引用if IE)Hack,实际项目中CSS Hack大部分是针对IE浏览器不同版本之间的表现差异而引入的。

  • 属性前缀法(即类内部Hack):例如 IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",IE6~IE10都认识"\9",但firefox前述三个都不能认识。

  • 选择器前缀法(即选择器Hack):例如 IE6能识别*html .class{},IE7能识别*+html .class{}或者*:first-child+html .class{}。

  • IE 条件注释法(即HTML条件注释Hack):针对所有IE(注:IE10+已经不再支持条件注释): <!--[if IE]>IE浏览器显示的内容 <![endif]-->,针对IE6及以下版本: <!--[if lt IE 6]>只在IE6-显示的内容 <![endif]-->。这类Hack不仅对CSS生效,对写在判断语句里面的所有代码都会生效。

  

CSS hack书写顺序,一般是将适用范围广、被识别能力强的CSS定义在前面。


_: 选择IE6及以下。连接线(中划线)(-)亦可使用,为了避免与某些带中划线的属性混淆,所以使用下划线(_)更为合适。


*:选择IE7及以下。诸如:(+)与(#)之类的均可使用,不过业界对(*)的认知度更高。

\9:选择IE6+。

\0:选择IE8+和Opera。

“\9\0″ 只对IE9/IE10生效,是IE9/10的hack



注:IE都能识别*;标准浏览器(如FF)不能识别*;

IE6能识别*;不能识别 !important;

IE7能识别*,能识别!important;

FF不能识别*,但能识别!important;


区别FF,IE7,IE6:

12    background:orange;*background:green;_background:blue;background:orange;*background:green!important;*background:blue;

:{background:red!important; background:green;} ie6下解释为背景色green,其它浏览器解释为背景色red;

本文转载自:

sheilacat
粉丝 35
博文 75
码字总数 35249
作品 0
长沙
程序员
私信 提问
关于浏览器兼容的问题

名词解释: 浏览器的内补丁:padding;外补丁margin: 关于css hack: CSS Hack大致有3种表现形式,CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack,CSS Hack主要针对类内部Hack:比如...

北极鳕鱼
2016/11/08
7
0
JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记2

技术很多,例子很多,只好慢慢学,慢慢实践!!现在学的这本书是【JavaScript实战----JavaScript、jQuery、HTML5、Node.js实例大全】 JavaScript、jQuery、HTML5、Node.js实例大全-读书笔记1...

woIwoI
2014/10/24
0
0
CSS if条件hack

IE的CSS if条件Hack- css hack 通过DIVCSS5为大家讲解DIV+CSS中if条件hack知识与教程实例 目录 1、Css if hack条件语法 - TOP 仅所有的WIN系统自带IE可识别 只有IE5.0可以识别 IE5.0包换I...

未来十年
2012/12/14
0
0
煮酒论英雄-CSS HACK 你不知道的那些事儿!

很多朋友搞不清楚CSS中有哪些HACK,怎么使用,我翻译+整理了一下贴在这里。这篇文章是关于CSS的hacking技术。不要和微软专有 的CSS属性“滤镜”混淆。 在 理想世界里,正确的CSS应该在任何支...

做h5的小韩
2016/07/12
10
0
各种浏览器CSS Hack的原理是什么?

CSS Hack的原理是什么 由于不同的浏览器对CSS的支持及解析结果不一样,还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。 CSS Hack大致有3种表现形式,CSS类...

webas
2013/04/20
253
1

没有更多内容

加载失败,请刷新页面

加载更多

java快递电子面单打印接口对接demo

之前的后天管理系统的电子面单打印使用的是灵通打单。 使用相对比较麻烦,需要到处Excel之后再导入,麻烦。 快递鸟有电子面单api,后台系统直接对接很是方便,不过也遇到了好些问题。 不难是...

程序的小猿
19分钟前
3
0
fasjtjson文档

https://github.com/alibaba/fastjson/wiki/JSONField

jirak
19分钟前
3
0
Mybatis中插入多条记录

Oracle数据库 实现方法 <insert id="saveWithdrawLog"> INSERT ALL INTO OSM_TRADE_DETAIL(SID,MBR_ID,USR_ID,TRADE_MONEY,TRADE_TYPE,TRADE_TIME,TRADE_WAY,PAY_ID) VALUES(#{si......

豫华商
20分钟前
3
0
Flink on YARN(下):常见问题与排查思路

作者:杨弢(搏远) Flink 支持 Standalone 独立部署和 YARN、Kubernetes、Mesos 等集群部署模式,其中 YARN 集群部署模式在国内的应用越来越广泛。Flink 社区将推出 Flink on YARN 应用解读...

开源中国小二
22分钟前
2
0
技术沙龙|京东云端到端多媒体关键技术揭秘

编者按:从带来更高编码效率、更好的用户体验的京享高清,到直播架构与网络演进优化,从而为用户带来更流畅的观看体验,以及运维系统的异常自动修复和高弹性的多媒体存储架构,一层一层展示出...

京东云技术新知
22分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部