在網頁設計中，如何讓圖片在鼠標懸浮時出現陰影呢？
這時候，我們可以使用 CSS 陰影效果來實現。
在下面的實例中，我們將通過示例代碼來分步驟教大家實現圖片鼠標懸浮陰影的效果。

/*為圖片設置默認樣式*/
img {
width: 200px;
height: 200px;
/*陰影效果*/
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}
/*設定鼠標懸浮效果*/
img:hover {
/*增加陰影效果*/
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.7);
}

首先，在 CSS 樣式表中，我們需要為圖片設置默認的樣式，包括寬度和高度。 同時，在這里我們也加入了陰影效果，以便圖片在默認狀態下出現陰影。

其次，為了讓圖片在鼠標懸浮時出現陰影效果，我們要對圖片的:hover狀態進行設置。這樣，在鼠標懸浮狀態下，圖片會出現更深的陰影效果，以便更加突出與周圍區域的差別。

通過上述代碼，我們可以很輕易地為圖片添加鼠標懸浮陰影效果。這樣，我們就可以輕松為網站圖像增加更好的視覺效果和更好的用戶交互體驗。