在網頁設計中，使用CSS來實現點擊后動畫效果是很常見的。以下是一個示例代碼：

.button {
position: relative;
display: inline-block;
padding: 10px 20px;
background-color: #f00;
color: #fff;
border-radius: 5px;
cursor: pointer;
}
.button:hover {
background-color: #ff3030;
}
.button:active {
transform: scale(0.95);
}
.button::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
background-color: rgba(255, 255, 255, 0.5);
z-index: -1;
transition: opacity 0.2s ease-in-out;
}
.button:active::before {
opacity: 1;
}

以上代碼展示了一個簡單的按鈕，當鼠標懸停在按鈕上時，按鈕背景顏色會變淺。當點擊按鈕時，按鈕會縮小一點，同時一個半透明的白色層會覆蓋在按鈕上，增加了點擊效果的視覺效果。

在CSS中，使用:active選擇器可以實現當元素被點擊時的樣式。通過給元素應用transform屬性，可以實現元素的縮放、旋轉等動畫效果。另外，在元素上疊加一個半透明的層也是實現點擊效果的常用技巧。

在實際開發中，可以根據需要進行更加復雜的點擊動畫效果，例如添加動畫過渡效果、使用CSS動畫庫等。