CSS中的.active是一種常見的選擇器，它可以用于實現當鼠標或鍵盤交互時改變元素樣式的效果。

.active {
color: red;
background-color: gray;
}

這個選擇器可以通過JavaScript來實現交互效果：

let element = document.querySelector('.active');
element.addEventListener('click', function() {
element.classList.toggle('active');
});

當用戶點擊element元素時，它的樣式會切換為.active類的樣式，當再次點擊時它會切換回初始樣式。

.active選擇器還可以用于創建活躍狀態的菜單或導航欄。例如，將當前所在頁面的鏈接狀態高亮：

.active {
color: #fff;
background-color: #007bff;
}

這樣，當用戶訪問鏈接所在頁面時，就會以.active樣式來呈現。這種樣式切換的效果可以通過Javascript來實現，也可以使用CSS的:hover偽類來實現：

a:hover {
color: #fff;
background-color: #007bff;
}

無論是使用Javascript還是CSS的偽類，.active選擇器都可以讓用戶在使用網站時獲得更好的體驗。