當我們訪問網站時，通常會遇到鼠標懸浮在圖片上時，圖片會發生一些變化的情況，這種效果一般是通過改變CSS樣式實現的。下面我們來看看如何通過鼠標懸浮在圖片上實現CSS樣式的切換。

代碼如下：
<style>
.img:hover {
/* 懸浮時的CSS樣式 */
border: 2px solid blue;
}
</style>
<div class="img">
<img src="image.jpg">
</div>

在這個例子中，我們使用了偽類選擇器:hover來監聽鼠標的懸浮事件，當鼠標懸浮在包含img的div上時，會應用定義好的CSS樣式，這里設置了2px的藍色邊框。通過這種方式，我們可以實現圖片的效果切換，如鼠標懸浮時改變圖片大小、透明度、背景色等等。

需要注意的是，當我們定義這種效果時，應該考慮到用戶體驗以及可訪問性。如果我們過度使用這種切換效果，可能導致用戶混淆，或者對于一些無法使用鼠標的用戶（如盲人）而言，這種效果也會造成無法訪問。因此，在設計網站時，要兼顧美觀與易于訪問的原則。