个人
笔记网站
个人网站
css旋转效果
div{
width: 100px;
height: 100px;
background: #0f0;
margin-top: 30px;
/*设置过渡时间及效果*/
transition: all 5s;
}
.a:active{
/*旋转 角度为360度*/
transform: rotate(360deg);
}
.b:active{
/*放大为原来的2倍 缩小为0-1倍*/
transform: scale(2);
}
.c:active{
/*倾斜为原来的45度 可为正负*/
transform: skew(45deg);
}
.d:active{
/*平移 可设两个值 中间用 “,” 分开 第一个值为x 第二个值为Y轴*/
transform: translate(300px);
}