css动画兼容

最新推荐文章于 2024-04-28 07:11:48 发布

fjnjxr

最新推荐文章于 2024-04-28 07:11:48 发布

阅读量640

点赞数

CC 4.0 BY-SA版权

分类专栏： CSS 文章标签： css 动画

本文链接：https://blog.youkuaiyun.com/fjnjxr/article/details/53767086

CSS 专栏收录该内容

3 篇文章

订阅专栏

今天高了个css动画，结果发现不兼容，仔细研究代码，需要充分考虑兼容性，代码如下，只做记录备用

.ahb .hb_btn {
text-align: center;
animation: change linear 1.5s infinite;
-moz-animation: change linear 1.5s infinite;
-webkit-animation: change linear 1.5s infinite;
-o-animation: change linear 1.5s infinite;
}

@keyframes change {
0% {
transform: scale(1.05, 1.05);
}
50% {
transform: scale(0.9, 0.9);
}
100% {
transform: scale(1.05, 1.05);
}
}

@-moz-keyframes change {
0% {
transform: scale(1.05, 1.05);
}
50% {
transform: scale(0.9, 0.9);
}
100% {
transform: scale(1.05, 1.05);
}
}

@-webkit-keyframes change {
0% {
transform: scale(1.05, 1.05);
}
50% {
transform: scale(0.9, 0.9);
}
100% {
transform: scale(1.05, 1.05);
}
}

@-o-keyframes change {
0% {
transform: scale(1.05, 1.05);
}
50% {
transform: scale(0.9, 0.9);
}
100% {
transform: scale(1.05, 1.05);
}
}