CSS是網頁設計中非常重要的一部分，通過樣式設置可以讓網頁呈現各種不同的風格和形態。而在CSS樣式設置中，有一項比較常用但卻容易被忽視的屬性--

transition

，可以用來設置CSS屬性的過渡效果。通過transition屬性，我們可以讓CSS樣式的改變更加平滑自然，提升用戶體驗。下面我們來看看如何使用transition屬性。

在CSS中，transition屬性的用法非常簡單，只需要在需要設置過渡效果的元素上添加一個transition屬性即可。transition屬性需要設置兩個值，分別是過渡效果的屬性值和過渡時間，具體語法如下:

/* 設置單個屬性的過渡效果 */
selector {
transition: property duration; 
}
/* 設置多個屬性的過渡效果 */
selector {
transition: property1 duration1, property2 duration2, ...;
}

在上面的語法中，property表示需要設置過渡效果的屬性，可以是任何CSS屬性，比如：background-color、color、font-size等。duration表示過渡時間，可以是s、ms等時間單位，表示動畫從開始到結束所需要的時間長度。

例如，我們要為按鈕添加一個漸變的背景色過渡效果，可以按照如下方式設置：

button {
background-color: #007bff; /* 初始顏色 */
transition: background-color 0.5s; /* 設置過渡效果 */
}
button:hover {
background-color: #00c7db; /* 鼠標懸停時的顏色 */
}

在上面的代碼中，我們設置按鈕的初始顏色為藍色，當鼠標懸停在按鈕上時，背景色會漸變為淡藍色（#00c7db），并在0.5秒的時間內完成過渡效果。

需要注意的是，transition屬性只能實現CSS屬性值的漸變效果過渡，無法實現CSS屬性之間的數值計算、動態改變等操作。如果需要實現更復雜的CSS動畫效果，可以使用@keyframes和animation屬性。