CSS 兼容属性

CSS 浏览器兼容前缀汇总

最新推荐文章于 2023-12-30 22:40:41 发布

原创最新推荐文章于 2023-12-30 22:40:41 发布 · 227 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css

CSS 专栏收录该内容

9 篇文章

订阅专栏

博客介绍了 CSS 浏览器兼容前缀，包括 Firefox 的 -moz-、Safari 和 Chrome 的 -webkit-、Opera 的 -o- 以及 IE 的 -ms-，为解决 CSS 在不同浏览器的兼容性问题提供参考。

CSS 浏览器兼容前缀
Firefox ： -moz-
Safari ： -webkit-
Chrome ： -webkit-
Opera ： -o-
IE ： -ms-

动画执行示例：
.container {
    background: url(../images/images.png) 0 0 no-repeat;
    animation: Ani 2.5s .15s linear infinite;
    -moz-animation: Ani 2.5s .15s linear infinite;        /* Firefox */
    -webkit-animation: Ani 2.5s .15s linear infinite;    /* Safari and Chrome */
    -ms-animation: Ani 2.5s .15s linear infinite;        /* ie */
    -o-animation: Ani 2.5s .15s linear infinite;        /* Opera */
}
@-webkit-keyframes Ani { 10% {} 20% {} 30% {} 40% {} 50%,100% {} }
@-moz-keyframes Ani { 10% {} 20% {} 30% {} 40% {} 50%,100% {} }
@-ms-keyframes Ani { 10% {} 20% {} 30% {} 40% {} 50%,100% {} }
@-o-keyframes Ani { 10% {} 20% {} 30% {} 40% {} 50%,100% {} }
@keyframes Ani { 10% {} 20% {} 30% {} 40% {} 50%,100% {} }