css动画兼容

╰+攻爆jí腚メ 2022-07-13 02:20 138阅读 0赞

今天高了个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);  
    \}  
\}

发表评论取消回复

表情：

评论列表（有 0 条评论，138人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS动画

效果图： ![20210420183258301.gif][] 实现效果描述: 子元素相对父元素水平垂直居中并重复循环放大缩小实现代码： <!DOCTYPE

Dear 丶/ 2023年01月14日 12:58/ 0 赞/ 161 阅读

相关 css 动画

上下滑动 html <div class="kaiqi">点击开启</div> css .kaiqi { color: ffffff;

川长思鸟来/ 2022年11月05日 05:24/ 0 赞/ 140 阅读

相关 css动画

在CSS中主要通过@keyframes和animation来实现的： @keyframes制定了一个元素的css样式变化的方式，也就是通过css央视的逐步改变，让它动起来，也

怼烎@/ 2022年10月29日 13:20/ 0 赞/ 358 阅读

相关 css动画兼容

今天高了个css动画，结果发现不兼容，仔细研究代码，需要充分考虑兼容性，代码如下，只做记录备用 .ahb .hb\_btn \{ text-align:

╰+攻爆jí腚メ/ 2022年07月13日 02:20/ 0 赞/ 139 阅读

相关 CSS动画

CSS3 动画通过 CSS3，我们能够创建动画，这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。 CSS3 @keyframes

Bertha 。/ 2022年06月07日 02:51/ 0 赞/ 245 阅读

相关 css动画

纯CSS3实现的8种Loading动画效果<div class="load1" > <div class="loader">加载中</div>

系统管理员/ 2022年06月05日 08:42/ 0 赞/ 212 阅读

相关 css动画

动画移动时间 animation: move 13s; 一直移动,无限循环 animation-iteration-count: infinite; 从A移动到

叁歲伎倆/ 2022年06月05日 00:53/ 0 赞/ 227 阅读

相关 css兼容

1、透明度一般在ie中用的是filter:alpha(opacity=0) 在firefox中，一般就是直接使用opacity:0 2、IE的怪异盒子在标准

旧城等待，/ 2022年06月01日 02:56/ 0 赞/ 201 阅读

相关 CSS动画

摘自阮一峰老师的博客 [http://www.ruanyifeng.com/blog/2014/02/css\_transition\_and\_animation.html]

喜欢ヅ旅行/ 2022年05月10日 00:54/ 0 赞/ 211 阅读

相关 CSS-动画

前言本文主要内容：过渡：transition 2D 转换 transform（scale，translate，rotate）

冷不防/ 2022年05月03日 09:30/ 0 赞/ 214 阅读