css transform360度旋转 外边旋转内容不旋转

html：

<div class="wrap_">    <ul>        <li class="one_"><a href="">360旋转</a></li>    </ul></div>

css：

.wrap_ ul li:hover{    border-style:dashed;    -webkit-animation: spinAround 9s linear infinite;    -moz-animation: spinAround 9s linear infinite;    animation: spinAround 9s linear infinite;}.wrap_ ul li:hover a{    -webkit-animation: spinAround1 9s linear infinite;    -moz-animation: spinAround1 9s linear infinite;    animation: spinAround1 9s linear infinite;}@-webkit-keyframes spinAround {    from {        -webkit-transform: rotate(0deg)    }    to {        -webkit-transform: rotate(360deg);    }}@-moz-keyframes spinAround {    from {        -moz-transform: rotate(0deg)    }    to {        -moz-transform: rotate(360deg);    }}@keyframes spinAround {    from {        transform: rotate(0deg)    }    to {        transform: rotate(360deg);    }}

@-webkit-keyframes spinAround1 {    from {        -webkit-transform: rotate(0deg)    }    to {        -webkit-transform: rotate(-360deg);    }}@-moz-keyframes spinAround1 {    from {        -moz-transform: rotate(0deg)    }    to {        -moz-transform: rotate(-360deg);    }}@keyframes spinAround1 {    from {        transform: rotate(0deg)    }    to {        transform: rotate(-360deg);    }}注：1.外边div正转360，内部元素倒转-360，和外部正传相抵消，不转；       2.rotate旋转属性；       3.兼容性；