CSS中有很多種方法可以創建圖片的動畫效果，下面介紹幾種常見的方式：

/* 方式一：使用CSS3的動畫 */
img {
position: absolute;
animation-name: myAnimation;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-direction: alternate;
}
@keyframes myAnimation {
from {
left: 0;
opacity: 1;
}
to {
left: 100px;
opacity: 0.5;
}
}

在這個例子中，我們使用了CSS3的動畫來使圖片移動并改變不透明度。我們定義了一個名為“myAnimation”的動畫，并在圖片上應用了這個動畫。動畫持續2秒，無限循環，在來回移動時改變不透明度。

/* 方式二：使用過渡效果 */
img {
transition: all 1s ease-in-out;
}
img:hover {
transform: scale(1.2);
}

在這個例子中，我們使用了CSS3的過渡效果。我們定義了一個1秒的過渡效果，并在鼠標滑過圖片時應用該效果。當鼠標滑過圖片時，圖片大小變為原來的1.2倍。

/* 方式三：使用關鍵幀動畫 */
img {
position: absolute;
animation: myAnimation 3s infinite;
}
@keyframes myAnimation {
0% {
transform: translateX(0);
}
25% {
transform: translateX(100px);
}
50% {
transform: translate(100px, 100px);
}
75% {
transform: translate(0, 100px);
}
100% {
transform: translate(0, 0);
}
}

在這個例子中，我們使用了CSS的關鍵幀動畫。我們定義了一個3秒的動畫，并分別在0%、25%、50%、75%和100% 處定義了動畫的變化。我們使用transform屬性來指定動畫的變化。這個動畫會使圖片在一個矩形框內移動。

通過使用CSS中的動畫效果，您可以為您的網頁增加一些生動的元素，讓頁面看起來更加生動、有趣。