scale.png
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>scale</title>
<style type="text/css">
div{
width: 200px;
height: 200px;
background: -webkit-linear-gradient(red 30%,yellow 100%);
margin: 10px;
text-align: center;
line-height: 200px;
font-size: 20px;
}
div:nth-child(2){
transform:scale(-0.8);
/*transform:scaleY(-0.8);*/
/*
1.transform:scale(0.8,0.5); 2個參數(shù) ,分別表示 水平 方向說法 ,垂直方向縮放蜈出, >1 表示放大吮炕,< 1 表示縮小
2.transform:scale(0.8); 1個參數(shù) 表示 水平 垂直一起縮放
3.transform:scaleX(1.2); scaleX 表示 水平方向縮放
4.transform:scaleY(1.2); scaleY 表示 垂直方向縮放
5.transform:scaleX(-0.8); 負數(shù) 表示 圍繞 Y 軸 垂直軸 翻轉 180deg
6.transform:scaleY(-0.8);負數(shù)表示 圍繞 x軸 水平軸 翻轉180deg
*/
}
</style>
</head>
<body>
<div>我不進行縮放</div>
<div>我會縮放</div>
</body>
</html>