<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
.box {
height: 100px;
background-color: pink;
}
.one {
width: 100px;
height: 100px;
background-color: red;
margin: 0 auto;
}
.box:hover .one {
/* 2d转换位移： 改变元素位置 */
/*transform: translate(100px,100px); */
/* 设置的是倍数 */
/*transform: scale(0.5,1); */
/*旋转*旋转/*/
/*transform: rotate(60deg); */
/*倾斜*/
transform: skew(30deg,30deg);
/*transform: translate(100px,100px);
}
</style>
</head>
<body>
<div class="box">
<div class="one">asdfafd</div>
</div>
</body>
</html>
2d ---transform转换
最新推荐文章于 2022-08-21 19:30:59 发布
179
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
