zoukankan      html  css  js  c++  java
  • 过渡效果

    过渡指的是元素的CSS属性值发生变化时的一种平滑过渡效果

    语法:

    1.属性:transition

      取值:property duration timing-fuction delay
      注意:1.属性简写是,四个属性值中,duration是必填项,其他三个属性值可以省略
         2.transition属性如果在伪类选择器中设置,元素的过渡效果只发生在第一次属性值变化的过程中,在有的属性值变化都不会添加过渡效果,为了保证页面效果,过渡属性在元素的默认样式中添加

    2.过渡详解
      1.属性:transition-property
       取值: CSS属性名称
       作用:指定某一个CSS样式在发生值变化时添加过渡效果
       注意:1.多个属性时,使用,号隔开
          2.可以省略,所有涉及值改变的属性都会被自动添加过渡效果
          3.all 指定所有CSS属性在值变化时产生的属性都会被自动添加自动过渡中
      2.属性:transition-duration
       取值:以s为单位的数值
       作用:指定过渡时长
      3.属性:transition-timing-function
       作用:指定过渡效果的速度变化曲线
       取值: 1. ease :默认值,慢速开始,中间速度变快,慢速结束
          2. linear:匀速变化
          3. ease-in:慢速开始,匀速结束
          4.ease-out:快速开始,慢速结束
          5. ease-in-out:慢速开始和结束,中间先加速
      4.属性:transition-delay
       作用 :延迟几秒之后再发生过渡效果
       取值 :s / ms为单位的数值

  • 相关阅读:
    @hdu
    @51nod
    @51nod
    @51nod
    JS-正则表达式常规运用
    CSS-复选框默认样式修改
    Vue-路由传参query与params
    Vue-阻止页面回退
    Vue-表单提交
    JS-原生的ajax
  • 原文地址:https://www.cnblogs.com/zengsf/p/9797048.html
Copyright © 2011-2022 走看看