CSS是前端開發中不可或缺的一部分，它可以為網頁美化提供很多便利，同時也提供了很多好用的樣式。取消按鈕是常見的網站元素之一，可以讓用戶在不進行任何操作的情況下退出當前界面。下面是CSS中常見的取消按鈕樣式。

.cancel-btn {
background-color: #fff;
border: 2px solid #000;
color: #000;
font-size: 1rem;
padding: 0.5rem 1rem;
text-decoration: none;
transition: all 0.3s ease;
cursor: pointer;
}
.cancel-btn:hover,
.cancel-btn:focus {
background-color: #000;
color: #fff;
}

以上代碼中，我們首先定義了一個類名為“cancel-btn”的樣式，它具有白色背景、黑色邊框、黑色文字、1rem的字體大小和上下0.5rem、左右1rem的內邊距。其中，我們使用“text-decoration:none”取消了文字下劃線。同時，我們還設置了動畫效果和鼠標指針樣式。

在“:hover”和“:focus”偽類中，我們設置了當鼠標移動到按鈕上方或者按鈕被聚焦時，按鈕樣式的變化。此時，按鈕文字變為白色，背景變為黑色。這種變化效果增加了按鈕的交互性，也讓用戶更容易發現這個元素。

我們可以將以上代碼直接應用于HTML中的按鈕元素上，這樣就能立即使用這個帶有動畫效果的取消按鈕了。