CSS可以通過鼠標(biāo)單擊事件來實(shí)現(xiàn)不同的效果，比如改變元素的顏色、形狀、位置等。在HTML中，可以通過為需要綁定事件的元素添加一個(gè)class或id來實(shí)現(xiàn)。

.clickable {
cursor: pointer;
}
#box {
background-color: red;
width: 100px;
height: 100px;
}
#box.clicked {
background-color: blue;
}

在上面的代碼中，我們定義了一個(gè)class名為"clickable"，它將指定元素的鼠標(biāo)光標(biāo)樣式為手型，以表示該元素可以被單擊。

同時(shí)，我們還定義了一個(gè)id名為"box"的元素，它的初始背景顏色為紅色，并具有100像素的寬和高。當(dāng)這個(gè)元素被單擊時(shí)，我們會(huì)將它的class改為"clicked"，以便通過CSS樣式表來改變其背景顏色為藍(lán)色。

為了使單擊事件生效，我們需要使用JavaScript來為元素綁定一個(gè)單擊事件監(jiān)聽器：

var box = document.getElementById("box");
box.addEventListener("click", function() {
box.classList.add("clicked");
});

在上面的代碼中，我們首先通過getElementById方法獲取了id為"box"的元素，然后使用addEventListener方法為該元素添加了一個(gè)單擊事件監(jiān)聽器。當(dāng)該元素被單擊時(shí)，我們會(huì)將它的class改為"clicked"，觸發(fā)CSS樣式來改變背景顏色為藍(lán)色。

通過以上步驟，我們可以使用CSS來控制鼠標(biāo)單擊事件的效果，而JavaScript則幫助我們監(jiān)聽事件和實(shí)現(xiàn)相應(yīng)的功能。這種組合可以讓我們更加靈活地控制網(wǎng)頁的行為和樣式。