CSS hack
由于不同厂商的流览器或某浏览器的不同版本(如IE6-IE11,Firefox/Safari/Opera/Chrome等),对CSS的支持、解析不一样,导致在不同浏览器的环境中呈现出不一致的页面展现效果。为了获得统一的页面效果,就需要针对不同的浏览器或不同版本写特定的CSS样式,我们把这个针对不同的浏览器/不同版本写相应的CSS code的过程,叫做CSS hack。CSS Hack方式
https://blog.csdn.net/freshlover/article/details/12132801
1、条件注释法
这种方式是IE浏览器专有的Hack方式,微软官方推荐使用的hack方式
2、类内属性前缀法
在CSS样式属性名前加上一些只有特定浏览器才能识别的hack前缀,以达到预期的页面展现效果。
3、选择器前缀法
针对一些页面表现不一致或者需要特殊对待的浏览器,在CSS选择器前加上一些只有某些特定浏览器才能识别的前缀进行hack。条件注释:
于HTML源码中被IE有条件解释的语句。条件注释可被用来向IE提供及隐藏代码。IE Hack:
即HTML条件注释Hack。这类Hack不仅对CSS生效,对写在判断语句里面的所有代码都会生效js 能力检测:
用js识别浏览器的能力。关键是先检测能达到目的的最常用的特性,必须实际测试要用到的特性。html5shiv.js:
htnl5shiv主要解决HTML5提出的新的元素不被IE6-8识别的问题,这些新元素不能作为父节点包裹子元素,并且不能应用CSS样式。让CSS 样式应用在未知元素上只需执行 document.createElement(elementName) 即可实现。html5shiv就是根据这个原理创建的。respond.js:
Respond.js让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持媒体查询。css reset:
因为早期的浏览器支持和理解的CSS规范不同,导致渲染页面时效果不一致,会出现很多兼容性问题,所以将浏览器的默认样式全部覆盖住normalize.css:
一个可以定制的CSS文件,它让不同的浏览器在渲染网页元素的时候形式更统一。它保护有用的浏览器默认样式,而不是完全去掉它们;为大部分HTML元素提供一般化的样式;修复浏览器自身的bug并保证各浏览器的一致性;用一些小技巧优化CSS可用性;用注释和详细的文档来解释代码。Modernizr:
Modernizr是一个开源的JS库,检测浏览器对 CSS3 或 HTML5 功能支持情况,使得设计师可以在支持HTML5和CSS3的浏览器中充分利用HTML5和CSS3的特性进行开发,同时又不会牺牲其他不支持这些新技术的浏览器的控制。postCSS:
PostCSS 提供了一种方式用 JavaScript 代码来处理 CSS,主要功能只有两个:第一个是把 CSS 解析成 JavaScript 可以操作的抽象语法树结构(Abstract Syntax Tree,AST),第二个就是调用插件来处理 AST 并得到结果。
一些浏览器兼容常用术语
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...