CSS是网页设计中非常重要的一部分，它可以实现各种炫酷的效果。其中，移动图片是CSS中常用的效果之一。

.img {
position: absolute;
left: 0;
top: 0;
transition: all 1s;
}
.img:hover {
left: -50px;
}

使用上述CSS代码，即可实现鼠标悬浮在图片上时，图片向左移动50px的效果。其中，position: absolute;和left: 0;的作用是将图片的位置设置为左上角，transition: all 1s;的作用是实现动画效果，img:hover {}表示鼠标悬浮在图片上时的效果。

这种效果不仅可以应用在图片上，也可以应用在其他元素上。例如，将.img改为.box，将background-image属性添加到.box的样式中，并将img:hover改为.box:hover，同样可以实现背景图片向左移动的效果。

.box {
width: 200px;
height: 200px;
background-image: url('image.jpg');
background-size: cover;
position: absolute;
left: 0;
top: 0;
transition: all 1s;
}
.box:hover {
left: -50px;
}

通过对CSS图片移动的实践，我们可以更深入地了解CSS的应用，增加对网页设计的理解和掌握。