以后有时间再来写。
<!DOCTYPE html>
<html>
<head>
<style>
.d1{
border:2px solid red;
width:200px;
height:100px}
.d2
{
width:200px;
height:100px;
background-color:yellow;
/* Rotate div */
transform:scale(0.3,0.3) translateX(100px);
transform:scale(1,1);
}
</style>
</head>
<body>
<div class="d1"><div class="d2">Hello World</div></div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
.d1{
border:2px solid red;
width:200px;
height:100px}
.d2
{
width:200px;
height:100px;
background-color:yellow;
/* Rotate div */
transform:translateX(100px);
transform:translateX(100px);
}
</style>
</head>
<body>
<div class="d1"><div class="d2">Hello World</div></div>
</body>
</html>多个transform只需要依次在一个transform后面添加即可，中间用空格分开，例如：
|
1
|
-webkit-transform:scale(
2
,
2
) rotate(
180
deg);
|
这样既放大又旋转
530
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
