用css怎么实现三个线条变箭头的动画

html-css010

用css怎么实现三个线条变箭头的动画,第1张

div{

width: 20px

height: 20px

border: 2px solid #000

border-top: none

border-right: none

transform:rotate(45deg)

}

你可以做一个带箭头的div;然后样式如下:

div

{

/* 箭头的样式,你自己设计,下面是旋转的样式*/

transform:rotate(90deg)

-ms-transform:rotate(90deg)/* Internet Explorer */

-moz-transform:rotate(90deg)/* Firefox */

-webkit-transform:rotate(90deg)/* Safari 和 Chrome */

-o-transform:rotate(90deg)/* Opera */

}

这个是CSS3,所以浏览器并不是都兼容的。上面的deg就是角度单位度。