[分享]css3按坐标点移动

CSS3按坐标点移动是使用CSS3的transform属性来实现一种让元素按照指定的坐标点移动的方式。首先需要明确的是transform属性只是改变了元素的视觉展现，而没有对页面布局产生任何影响。接下...

CSS3按坐标点移动是使用CSS3的transform属性来实现一种让元素按照指定的坐标点移动的方式。

首先需要明确的是transform属性只是改变了元素的视觉展现，而没有对页面布局产生任何影响。

接下来，我们就可以通过以下的CSS代码来实现CSS3按坐标点移动：

.move {
  position: absolute;
  top: 50px;
  left: 50px;
  transform: translate(100px, 100px);
} 

上述代码的含义是，对带有move类名的元素，将其放置在距离左上角顶点为(50px, 50px)的位置，然后再将该元素的坐标点平移100px，也就是将该元素移动到距离元素原来位置向右100px，向下100px的新位置。

需要注意的是，translate参数的第一个值是表示水平方向上的移动量，正值表示向右移动，负值表示向左移动；而第二个值则是表示在竖直方向上的移动量，正值表示向下移动，负值表示向上移动。

通过使用上述的CSS代码，我们就可以实现CSS3按坐标点移动的效果了。