CSS是前端開發中必不可少的技能之一，其中涉及到的眾多特效、動畫等等功能也是前端開發人員必須掌握的。今天我們要講解的是CSS鼠標點上變顏色的效果。

大家都知道，在前端開發中，鼠標經常會和頁面進行交互，比如點擊、懸停等等。如果給這些鼠標交互添加上一個變顏色的效果，會讓頁面更加生動有趣。

下面我們來看看這種效果該如何實現：

/*定義鼠標懸浮時可變化的屬性*/
:hover {
color: red;
font-size: 20px;
}
/*定義默認狀態的屬性*/
p {
color: black;
font-size: 16px;
}

以上的代碼中，我們使用了:hover選擇器來定義鼠標懸浮時可變化的屬性，包括顏色和字號。同時，我們也設置了默認狀態下的屬性，即p標簽的顏色為黑色，字號為16px。

值得注意的是，在使用:hover選擇器時，我們需要注意選擇器的位置，保證它在其他選定器的下面。否則，該效果將失效。

總之，通過上述方法，我們可以輕松實現CSS鼠標點上變顏色的效果，讓頁面更加生動有趣，為用戶提供更好的交互體驗。