當(dāng)鼠標(biāo)經(jīng)過一個(gè)圖標(biāo)時(shí)，我們常常希望這個(gè)圖標(biāo)有一些視覺上的變化，比如顏色、大小等等。而這些變化可以用CSS來實(shí)現(xiàn)。

首先，在HTML文件中我們需要為圖標(biāo)添加一個(gè)class，比如這里我們使用一個(gè)class名為icon：

<i class="icon"></i>

然后，在CSS文件中我們可以為這個(gè)class添加一些樣式，比如初始時(shí)定義圖標(biāo)的顏色，背景色，大小等等：

.icon {
color: #999;
background-color: #eee;
font-size: 20px;
}

接下來，當(dāng)鼠標(biāo)經(jīng)過這個(gè)圖標(biāo)時(shí)，我們可以使用:hover偽類來改變它的樣式，比如改變它的顏色、背景色等等：

.icon:hover {
color: #333;
background-color: #ccc;
}

最后，將這些代碼整合起來，我們就得到了一個(gè)鼠標(biāo)經(jīng)過圖標(biāo)切換CSS的效果：

<i class="icon"></i>
.icon {
color: #999;
background-color: #eee;
font-size: 20px;
}
.icon:hover {
color: #333;
background-color: #ccc;
}

這樣，當(dāng)鼠標(biāo)經(jīng)過這個(gè)圖標(biāo)時(shí)，它的顏色和背景色就會(huì)隨之改變。