• transition CSS3动画属性之过渡


    CSS3新增动画属性,transition(过渡)属性介绍,其作用就是:平滑的改变CSS的属性值

    transition 属性是一个简写属性,用于设置四个过渡属性:

    • transition-property   指定过渡的性质,(如:background属性,默认值为all)
    • transition-duration   指定当前过渡的持续时间
    • transition-timing-function  延迟触发过渡时间
    • transition-delay    指定过渡类型(有:linear | ease | ease-in | ease-out | ease-in-out)

    简写属性,transition:all 1s 3s linear; //PS:all所有的css属性都拥有过渡,过渡时间为1s,延迟3s触发动画,执行匀速触发函数。

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <style>
            .trans {
                -webkit-transition: all 3s 2s linear;
                -moz-transition: all 3s 2s linear;
                -ms-transition: all 3s 2s linear;
                -o-transition: all 3s 2s linear;
                transition: all 3s 2s linear; /*所有CSS属性都拥有过渡属性,动画持续时间3s 延迟2s触发 linear的触发函数*/
            }
            .trans:hover {
                background-color: #486AAA;  /*背景色+颜色拥有过渡属性值*/
                color: #fff;
            }
        </style>
    </head>
    <body>
    <a class="trans" href="javascript:void(0);">动态a数据</a>
    </body>
    </html>
  • 相关阅读:
    eclipse tomcat插件
    eclipse.ini
    iBatis杂记
    oracle 10g express 下载网址
    免费ftp客户端 winscp
    maven web app 发布到Tomcat
    sqlserver获取本月最后一天
    ArrayCollection和ComboBox
    flex框架 Cairngorm
    HDU3420 Bus Fair
  • 原文地址:https://www.cnblogs.com/zhuwenqin/p/7998849.html
Copyright © 2020-2023  润新知