为什么无法实现360度旋转?

来源:3-1 transition简写

web_東

2017-03-09 05:39:25


<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>3-1作业</title>

    <style>

        div {

            font-size: 14px;

            font-weight: bold;

            line-height: 50px;

            position:absolute;

            top:50%;

            right: 0;

            bottom: 0;

            left: 0;

            width: 200px;

            height: 50px;

            margin: 0 auto 0;

            text-align: center;

            background: #abcdef;

            /*此处写代码*/

/*            cursor: pointer;*/

/*            -webkit-transform:rotate(0deg);*/

                    transform:rotate(90deg);

/*            -webkit-transform:scale(1);*/

                    transform:scale(1);

/*            -webkit-transition-property:transform;*/

                    transition-property:transform;

/*            -webkit-transition-duration:1s;*/

                    transition-duration:1s;

/*            -webkit-transition-timing-function:ease-in-out;*/

                    transition-timing-function:ease-in-out;

/*            -webkit-transition-delay:0s;*/

                    transition-delay:0s;

           

        }

        /*此处写代码*/

        div:hover {

/*            -webkit-transform:rotate(90deg);*/

                    transform:rotate(90deg);

/*            -webkit-transform:scale(2);*/

                    transform:scale(2);

            cursor: pointer;

/*            -webkit-transition-property:transform;*/

                    transition-property:transform;

/*            -webkit-transition-duration:2s;*/

                    transition-duration:2s;

/*            -webkit-transition-timing-function:ease-in-out;*/

                    transition-timing-function:ease-in-out;

/*            -webkit-transition-delay:0s;*/

                    transition-delay:0s;

    

        } 

       

    </style>

</head>

<body>

    <div>www.imooc.com</div>

</body>

</html>


写回答

1回答

web_東

提问者

2017-03-09

不好意思电脑卡住啦,所以连续发了2次。

0

0 学习 · 5760 问题

查看课程