在網頁中，經常會有長頁面的情況，如果用戶需要一直向下滑動頁面才能查看底部內容，會讓用戶感到不方便。這時候，一鍵置頂功能就變得非常有用。

CSS 一鍵置頂功能可以通過設置一個按鈕，在用戶點擊時，讓頁面直接滑動到頂部。

// HTML代碼一鍵置頂// JavaScript代碼
function scrollToTop() {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
}

在 HTML 代碼中，我們創建了一個按鈕，并在點擊時調用 scrollToTop 函數。該函數通過 JavaScript 編寫，并使用 window.scrollTo 方法將頁面的滾動位置設置到頂部。

注意： 在 scrollTo 方法中，我們使用了 behavior 參數，并將其設置為 smooth。這個屬性的作用是使滾動平滑且有動畫效果。

除此之外，我們還可以通過 CSS 樣式來美化一鍵置頂按鈕。例如，可以設置背景色、邊框、圓角、陰影等等。

/* CSS樣式 */
button {
position: fixed;
right: 20px;
bottom: 20px;
width: 80px;
height: 80px;
border-radius: 50%;
background-color: #42b983;
color: #fff;
font-size: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
border: none;
outline: none;
cursor: pointer;
transition: all 0.3s;
}
button:hover {
transform: scale(1.1);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
}

在上面的 CSS 樣式中，我們使用了 position: fixed 使按鈕固定在右下角。同時，設置了寬高、圓角、背景色、字體大小、邊框樣式等等。此外，我們還添加了 hover 樣式，使按鈕在鼠標懸停時有縮放和陰影效果。

最后，我們將 CSS 樣式和 JavaScript 函數結合起來，就可以實現一個漂亮的一鍵置頂按鈕了。