Css3新增属性 (8)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            #div1{
                width: 200px;height: 200px;
                background: red;
                transition: 2s all 1s linear;
            }
            #div1:hover{background: blue;width: 260px; height: 260px;}
        </style>
    </head>
    <body>
        <div></div>
        <button>淅变</button>
    </body>
    <script type="text/javascript">
        window.onload=function(){
            div1=document.getElementById("div1");
            tran=document.getElementById("tran");
            tran.onclick=function(){
                div1.style.background="pink";
                div1.style.width="300px";
                div1.style.height="300px";
            }
        }
    </script>
</html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/zzdpdw.html