CSS是一種在網頁設計中非常重要的語言，可以實現豐富且炫酷的視覺效果。在這里，我們將使用CSS畫魔方動畫并添加圖片。

/* 魔方的CSS樣式 */
.cube{
width: 360px;
height: 360px;
position: relative;
}
.face{
width: 120px;
height: 120px;
position: absolute;
background-image: url('cube.png'); /* 魔方圖案 */
background-repeat: no-repeat;
}
/* 魔方動畫效果 */
.cube.active .face{
-webkit-transform-origin: 50% 50%; /* 旋轉中心 */
animation: spin 2s infinite linear; /* 無限循環 */
}
/* 魔方動畫關鍵幀 */
@-webkit-keyframes spin{
from{
-webkit-transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
}
to{
-webkit-transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
}
}

在CSS中，我們首先定義了一個魔方類，它的寬度和高度為360px，并且帶有相對定位。接下來，我們定義了一個面類，它的寬度和高度為120px，并且帶有絕對定位。此外，我們還給面類添加了一個魔方圖案，以及設置了這個圖案不會重復出現。

在魔方動畫效果中，我們使用了“active”類，使魔方可以旋轉。當魔方添加了“active”類后，我們將面類的旋轉中心設置為50%和50%，然后定義了一個旋轉的動畫“spin”，它將持續2秒，并且將在無限循環中進行

最后，我們定義了魔方動畫的關鍵幀“spin”，它從初始狀態開始，依次繞X、Y、Z三個軸旋轉，并最終達到360度。這將使魔方以各種不同的角度不斷旋轉。

通過以上CSS代碼，我們就可以在網頁上呈現一個炫酷的魔方動畫加圖片了。