現代網頁設計的視覺效果對用戶體驗至關重要，其中，點擊效果是網頁交互中一個重要的元素。而CSS3技術的發展，為實現更加豐富的點擊效果提供了更多可能。下面，我將為大家介紹如何使用CSS3實現點擊有波動效果。

button {
border: none;
outline: none;
padding: 12px 20px;
border-radius: 30px;
font-size: 18px;
color: #fff;
background-color: #1abc9c;
position: relative;
overflow: hidden;
}
button:hover {
background-color: #16a085;
}
button:before {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0);
background-color: rgba(255, 255, 255, 0.4);
width: 10px;
height: 10px;
border-radius: 100%;
}
button:active:before {
transition: transform 0.5s, opacity 1s;
transform: translate(-50%, -50%) scale(30);
opacity: 0;
}

以上是一個簡單的CSS3代碼實現點擊有波動效果的例子。其中，我們在按鈕的before偽類中添加了一個圓形元素，并通過scale屬性來設置元素從小到大的動畫效果。在按鈕的active狀態下，通過transform屬性將圓形元素擴大并透明度漸變，從而實現點擊時產生波動的視覺效果。

當然，我們也可以通過其他屬性組合實現不同的波動效果，比如opacity、box-shadow等等。不過，在使用時還需要注意不同瀏覽器之間的兼容問題?？傊ㄟ^CSS3實現點擊有波動效果，為網頁交互增色不少。