• Transition 所支持的css属性


    transition-property是用来指定当元素其中一个属性改变时执行transition效果: 所支持的属性类型如下:

    1. color: 通过红、绿、蓝和透明度组件变换(每个数值处理)如:background-color,border-color,color,outline-color等css属性;
    2. length: 真实的数字 如:word-spacing,width,vertical-align,top,right,bottom,left,padding,outline-width,margin,min-width,min-height,max-width,max-height,line-height,height,border-width,border-spacing,background-position等属性;
    3. percentage:真实的数字 如:word-spacing,width,vertical-align,top,right,bottom,left,padding,outline-width,margin,min-width,min-height,max-width,max-height,line-height,height,border-width,border-spacing,background-position等属性;
    4. integer离散步骤(整个数字),在真实的数字空间,以及使用floor()转换为整数时发生 如:outline-offset,z-index等属性;
    5. number真实的(浮点型)数值,如:zoom,opacity,font-weight,等属性;
    6. transform list
    7. rectangle:通过x, y, width 和 height(转为数值)变换,如:crop
    8. visibility: 离散步骤,在0到1数字范围之内,0表示“隐藏”,1表示完全“显示”,如:visibility
    9. shadow: 作用于color, x, y 和 blur(模糊)属性,如:text-shadow
    10. gradient: 通过每次停止时的位置和颜色进行变化。它们必须有相同的类型(放射状的或是线性的)和相同的停止数值以便执行动画,如:background-image
    11. paint server (SVG): 只支持下面的情况:从gradientgradient以及colorcolor,然后工作与上面类似
    12. space-separated list of above:如果列表有相同的项目数值,则列表每一项按照上面的规则进行变化,否则无变化
    13. a shorthand property: 如果缩写的所有部分都可以实现动画,则会像所有单个属性变化一样变化
  • 相关阅读:
    分布式爬虫
    前端页面展示
    fillter根据value来匹配字段
    element ui 怎么去修改el-date-picker的时间
    element ui,input框输入时enter健进行搜索
    element ui 里面的table怎么弹出一个框让表中数据点击出现弹框
    修改数据结构记录,将同级数据改成父子集数据
    h5的复制功能的使用,Clipboard.js的使用,主要是在app里面使用
    在安卓手机下按钮会悬浮在键盘上,怎么解决vue.js
    last-child为啥不生效
  • 原文地址:https://www.cnblogs.com/yunkou/p/4235469.html
Copyright © 2020-2023  润新知