CSS技術(shù)能夠?yàn)榫W(wǎng)頁添加許多實(shí)用且美觀的功能，比如返回頂頁的按鈕。通過使用CSS編寫代碼，我們可以輕松創(chuàng)建一個(gè)簡(jiǎn)單的按鈕，使用戶可以直接回到頁面頂部。

.back-to-top {
position: fixed;
bottom: 20px;
right: 20px;
display: none;
cursor: pointer;
}
.back-to-top.show {
display: block;
}
.back-to-top:hover {
opacity: 0.8;
}
.back-to-top img {
height: 40px;
width: 40px;
}

上面這段CSS代碼可以創(chuàng)建一個(gè)在頁面右下角的返回頂頁按鈕，并且將其隱藏。當(dāng)用戶開始向下滾動(dòng)屏幕時(shí)，按鈕會(huì)顯示出來，可以通過添加類名“show”來實(shí)現(xiàn)。

最后，我們只需要使用JavaScript代碼將按鈕與滾動(dòng)條綁定即可：

window.addEventListener("scroll", function () { 
var backToTopBtn = document.querySelector(".back-to-top"); 
if (window.pageYOffset >200) { 
backToTopBtn.classList.add("show"); 
} else { 
backToTopBtn.classList.remove("show");
} 
});
var backToTopBtn = document.querySelector(".back-to-top");
backToTopBtn.addEventListener("click", function () { 
window.scrollTo(0, 0); 
});

這段代碼使用了“scroll”事件，當(dāng)用戶開始滾動(dòng)屏幕時(shí)，按鈕會(huì)根據(jù)頁面滾動(dòng)條的位置動(dòng)態(tài)地顯示或隱藏。并且當(dāng)用戶單擊返回頂頁按鈕時(shí)，頁面就會(huì)自動(dòng)滾動(dòng)到頁面最頂端。

通過使用CSS和JavaScript技術(shù)，我們可以輕松地創(chuàng)建一個(gè)返回頂頁的按鈕，為頁面增添更多的友好性和交互性。