<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
img{
width: 200px;
height: 200px;
transition: all 1s;
/**transform-origin:10px 30px;*/ /**旋转中心处*/
transform-origin:left top;
}
img:hover{
/**transform: translate(0,-10px);偏移 根据X轴和Y轴位置给定的参数,从当前元素位置移动。**/
/**transform: rotate(360deg); 旋转角度 正值顺时针 负值逆时针*/
/** transform: scale(2,3);变大或缩小,根据x轴y轴*/
/** transform: skew(30deg,50deg);根据x轴y轴进行扭曲**/
}
</style>
</head>
<body>
<img src="./1.png"/>
</body>
</html>