zoukankan      html  css  js  c++  java
  • css3 动画

    <!DOCTYPE html>
    <html>
    <head>
    <title>过渡动画</title>
    <style type="text/css">
    div{
    200px;
    height: 300px;
    background-color: red;
    margin: 100px auto;
    /*过渡动画对元素本身没有任何的改变只是一个过渡*/
    /*transition-property是用来设置受动画影响的属性 也就是给什么属性左动画*/
    /*transition-property: all;*/
    /*transition-duration: 2s;*/
    /*注意延时等待对过渡动画完成后返回原状时也生效*/
    /*transition-delay: 2s;*/
    /*动画曲线
    linear 规定以相同速度开始至结束的过渡效果
    ease 规定慢速开始,然后变快,然后慢速结束的过渡效果
    ease-in 规定以慢速开始的过渡效果
    ease-out 规定以慢速结束的过渡效果
    ease-in-out 规定以慢速开始和结束的过渡效果*/
    /*transition-timing-function: linear;*/
    /*同样transition和background类型属性集合的写法
    注意:持续和等待时间 写的时候是有顺序的 前一个是持续时间 后一个是等待时间*/
    transition: all linear 1s 0s;
    }
    /* hover 徘徊
    鼠标放上后的效果*/
    div:hover{
    500px;
    height: 500px;
    /*opacity: 0;*/
    background-color: green;
    }
    </style>
    </head>
    <body>
    <div></div>
    </body>
    </html>

  • 相关阅读:
    java实现九九乘法表
    for循环的阶乘
    Struts2 表单提交与execute()方法的结合使用
    Struts2 第三个程序 namespacce的用法
    java 字符串的比较compareTo
    java中的位预算
    java调用C++ DLL库方法
    Socket编程模式理解与对比
    c 高级函数的简单用法
    TCP粘包分析与处理
  • 原文地址:https://www.cnblogs.com/adialike/p/6389038.html
Copyright © 2011-2022 走看看