css如何实现属性过渡的效果

所谓属性过渡,就是从一个属性变到另一个属性。例如下面的进度条

css如何实现属性过渡的效果_第1张图片

我们之前学过的就是:hover,但是这个是瞬间变化的,看上去不够美观。我们可以通过transition属性来控制变化的具体效果如何时开始变化、变化哪些属性等。

语法

transition:要过渡的属性 花费时间 运动曲线 何时开始;

1.属性:想要变化的css属性,宽度高度、背景颜色、内外边距都可以。如果想要所有属性都变化过渡,可以添加all

2.花费时间:多久完成变化,单位是秒(必须写)

3.运动曲线:默认是ease(一般不用管)

4.何时开始:单位是秒(必须写),可以设置延迟触发时间





    
    
    
    Document
    



    

怎么样,你学会了吗?

你可能感兴趣的:(前端只因变凤凰之路,css3,前端,css,css过渡)