CSS清除按鈕效果可用于清除輸入框中的內容，使得用戶可以重新輸入新的內容。接下來，我們將演示如何創建一個CSS清除按鈕效果。

/* CSS code */
.clear-btn {
position: relative;
display: inline-block;
width: 16px;
height: 16px;
background-image: url('path/to/clear-icon.png');
background-repeat: no-repeat;
background-position: center center;
cursor: pointer;
}
.clear-btn:hover {
opacity: 0.7;
}

上述代碼首先創建了一個class為.clear-btn的元素，該元素為相對定位的塊級元素，寬高為16px，背景圖像為一個清除圖標，鼠標指針為手型。當鼠標懸浮在該元素上時，透明度會降低。

接下來，我們需要創建一個包含輸入框和清除按鈕的元素。

/* HTML code */

上述代碼創建了一個class為.input-container的元素，該元素包含了一個type為text的輸入框和一個class為.clear-btn的清除按鈕。這樣，用戶只需要在輸入框輸入文字，當需要清除時，單擊清除按鈕即可。

至此，我們已經完成了CSS清除按鈕效果的創建。希望這篇文章可以幫助你學習如何使用CSS創建清除按鈕效果。