参考链接:
https://www.cnblogs.com/xmlys/p/7716134.html
CSS浏览器前缀兼容写法
1、浏览器引擎前缀(Vendor Prefix)有哪些?
-moz- /* 火狐等使用Mozilla浏览器引擎的浏览器 */
-webkit- /* Safari, 谷歌浏览器等使用Webkit引擎的浏览器 */
-o- /* Opera浏览器(早期) */
-ms- /* Internet Explorer (不一定) */
浏览器 内核 前缀
IE trident -ms-
Firefox gecko -moz-
Google webkit/blink -webkit-
Safari webkit -webkit-
Opera presto -o-
2、主要的需要添加浏览器引擎前缀(vendor-prefix)的属性包括:
@keyframes
移动和变换属性(transition-property, transition-duration, transition-timing-function, transition-delay)
动画属性 (animation-name, animation-duration, animation-timing-function, animation-delay)
border-radius
box-shadow
backface-visibility
column属性
flex属性
perspective属性
3、例子:
/* 简单属性 */
.myClass {
-webkit-animation-name: fadeIn;
-moz-animation-name: fadeIn;
-o-animation-name: fadeIn;
-ms-animation-name: fadeIn;
animation-name: fadeIn; /* 不带前缀的放到最后 */
}
/* 复杂属性 keyframes */
@-webkit-keyframes fadeIn {
0% { opacity: 0; } 100% { opacity: 0; }
}
@-moz-keyframes fadeIn {
0% { opacity: 0; } 100% { opacity: 0; }
}
@-o-keyframes fadeIn {
0% { opacity: 0; } 100% { opacity: 0; }
}
@-ms-keyframes fadeIn {
0% { opacity: 0; } 100% { opacity: 0; }
}
/* 不带前缀的放到最后 */
@keyframes fadeIn {
0% { opacity: 0; } 100% { opacity: 0; }
}
4、对于一些属性:border-radius , linear-gradient, 和 box-shadow, 你可以使用CSS3Pie,它是一个很小的文件,把它放到你的网站的根目录下,就能让你的页面中IE6,IE8中也支持这些属性。
分享到:
相关推荐
CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页布局CSS属性、浏览器兼容与网页...
css浏览器兼容写法 如果只让ie6看见用*html .head{color:#000;} 如果只让ie7看见用*+html .head{color:#000;} 如果只让ff看见用:root body .head{color:#000;} 如果只让ff、IE8看见用html>/**/body .head{color:#000...
各浏览器css兼容写法各浏览器css兼容写法
CSS在不同浏览器中兼容问题CSS在不同浏览器中兼容问题CSS在不同浏览器中兼容问题CSS在不同浏览器中兼容问题CSS在不同浏览器中兼容问题CSS在不同浏览器中兼容问题
浏览器兼容常见问题css兼容 css兼容 浏览器兼容 IE6789兼容
css 多浏览器兼容解决方案 下载,web制作必备。
CSS的各种浏览器兼容一栏表
各种浏览器的兼容性和CSS HACK的写法,让你不再为IE6和各种浏览器的兼容性发愁,非常方便!
CSS Hack 不得不在一些项目中运用到
别具光芒——CSS属性、浏览器兼容
最全的CSS浏览器兼容问题整理(IE6.0、IE7.0 与 FireFox)
CSS 对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE与Firefox的兼容性处理方法并整理了一下
CSS Hack 浏览器兼容文档 ,用于兼容IE6、IE7、IE8、IE9、FF
一份对CSS各浏览器兼容解决总结,比较全面
css hack ie6 ie7 ie8 firefox等浏览器兼容性
解决不通浏览器样式(CSS)兼容问题,符合W3C标准。
资源内容主要市记录了一些CSS-跨浏览器兼容的一些处理。包含了基础篇,讲解了css的基础知识。也包含了实战篇,介绍用css如何解决兼容性问题及其原理、工作流程
CSS hack浏览器兼容一览表,html文件。
css浏览器兼容问题内部资料 欢迎下载!实例研究!