css过渡

作者: 皇甫圣坤 | 来源:发表于2019-06-21 08:01 被阅读0次
    div {
              background: #000;
              transition: background 1s;
          }
    
          div:hover {
              background: red;
          }
    
     /* 
        transition-property
            需要添加过渡效果的属性名 all:所有属性
        transition-duration
            过渡的总时长
        transition-timing-function
            过渡的时间曲线
          ease   慢 匀速 缓慢结束
          linear   匀速
          ease-in   慢慢进入  匀速
          ease-out   匀速 慢慢出去
          ease-in-out   慢慢进入 匀速 慢慢出去
          自定义曲线公式  cubic-bezier(0,.65,1,.46)
        transition-delay
            过渡的延迟时间
            正直等待对应的时间在执行动画
            负值则是跳过对应的时间开始动画
         */
    

    时间曲线:百度、贝塞尔曲线可视化

    相关文章

      网友评论

          本文标题:css过渡

          本文链接:https://www.haomeiwen.com/subject/uyssqctx.html