今天我們來學習如何使用CSS來讓圖片從左側飛入。這種效果常常被用在網站的首頁、產品展示、圖片輪播等地方。

先來看看代碼：

.slide-in {
position: relative;
left: -1000px;
animation: slide-in 1s ease forwards;
}
@keyframes slide-in {
100% { left: 0; }
}

代碼中，我們創建了一個名為slide-in的類名，給需要飛入的圖片添加該類。然后，我們設置圖片的初始位置是相對于視窗左側1000個像素的位置，也就是在視窗外面。

接著，我們使用CSS3動畫來實現從左側飛入的效果。我們定義了一個名為slide-in的動畫，設置動畫的執行時間為1秒，動畫函數為ease（即先慢后快），執行后停留在結束位置（也就是left為0的位置）。

最后，在keyframes中，我們定義了從開始位置（left:-1000px）到結束位置（left:0）的動畫過程。

實現完畢后，我們只需要在HTML中將需要飛入的圖片添加slide-in類名即可。

代碼使用說明：

.slide-in {
position: relative;
left: -1000px;
animation: slide-in 1s ease forwards;
}
@keyframes slide-in {
100% { left: 0; }
}

需要注意的是，在使用CSS動畫時需要添加不同瀏覽器的前綴，例如-webkit-animation、-moz-animation等。

好了，我們已經成功地學會了如何使用CSS讓圖片從左側飛入了，你可以嘗試著在自己的網站上使用這個效果，讓網站更加生動活潑。