有时候我们可能需要在网页中添加一些图片动画来增加页面的趣味性和活力。CSS的动画功能使得我们可以通过简单的代码实现一些复杂的动画效果，比如这里介绍的图片上下运动动画。下面是实现这个动画的代码：

img {
animation: moveUpDown 2s ease-in-out infinite;
}
@keyframes moveUpDown {
from {
transform: translateY(0);
}
to {
transform: translateY(-10px);
}
}

以上代码中，我们为需要运动的图片添加了一个animation属性，指定了动画名称moveUpDown，并设置了2秒钟的运动时间，ease-in-out的动画缓动效果，以及无限循环动画的infinite属性。

接下来定义动画的具体细节，即keyframes关键字。我们将动画细节定义在moveUpDown名称下，首先指定了动画开始的状态，即图片的位置不变，不进行位移。随后我们指定动画结束时的状态，即图片在Y轴上向上移动了10像素。这里使用了CSS3的transform变形属性来控制图片的位移，translateY(0)表示图片不进行位移，translateY(-10px)表示图片沿着Y轴上移10像素。

最后，我们将animation和keyframes属性使用组合在一起，使得图片按照我们定义好的方式进行上下运动。

通过这个简单的动画效果，我们可以为网页添加一定的趣味性和动态效果，让用户感觉更加活力四射。在实际开发中，可以根据具体要求修改代码中的一些参数，比如动画持续时间、缓动效果、位移距离等等，使得图片运动更加多样化。