translate
translate(x,y)在x轴和y轴方向同时移动
translate X(x)在x轴方向移动
translateY(y)在y轴方向移动
先看效果
代码参考
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>move</title>
<style>
body{
width: 0;
height: 0;
}
div{
height: 100px;
width: 100px;
background-color:blue;
border-radius: 50%;
transition:3s;
}
div:hover{
transform:translate(200px,200px);
}
</style>
</head>
<body>
<div class="ball"></div>
</body>
</html>
border-radius: 50%; /*制作一个圆*/