CSS中的鼠標劃過效果是很常見的一種交互效果，它可以讓用戶感知到當前鼠標停留的位置，并且提供一些額外的信息提示。當鼠標劃過子元素時，我們可以使用偽類選擇器來實現相應的CSS效果。

鼠標劃過的CSS偽類選擇器為:hover，以實現子元素的樣式變化。例如，當鼠標劃過一個超鏈接時，可以使用下面的CSS樣式來添加一個下劃線效果：

a:hover {
text-decoration: underline;
}

另外一個示例是，當鼠標劃過菜單項時，可以使用下面的CSS樣式來改變菜單項的背景顏色：

ul li:hover {
background-color: #F5F5F5;
}

需要注意的是，當鼠標劃過一個元素時，其所有子元素都會受到這個偽類的影響。如果我們只需要改變特定子元素的樣式，可以通過使用CSS子元素選擇器實現。例如，如果我們希望改變列表項中的鏈接顏色：

ul li a:hover {
color: red;
}

這樣就只有當鼠標劃過列表項中的鏈接時才會有顏色變化，而其他元素則不會受到影響。

CSS中的鼠標劃過效果可以提供很多交互性的選擇，使得我們的網站更加生動有趣。同時，使用CSS樣式的優化也可以提升用戶體驗。