在日常浏览网页时，尤其是内容较长的页面，是否常有想快速回到顶部的需求？这时，“返回顶部”的小功能就显得格外贴心啦！不仅提升了用户体验，也让页面操作更加便捷。下面，给大家分享一段简单实用的代码，轻松实现这一功能👇：
首先，在你的网页代码中添加以下按钮元素：
```html
```
接着，使用CSS设置按钮样式，让它固定在页面右下角：
```css
myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
background-color: 555;
color: white;
cursor: pointer;
padding: 15px;
border-radius: 4px;
}
```
最后，添加JavaScript代码，实现滚动效果：
```javascript
window.onscroll = function() {scrollFunction()};
function scrollFunction() {
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
document.getElementById("myBtn").style.display = "block";
} else {
document.getElementById("myBtn").style.display = "none";
}
}
function topFunction() {
document.body.scrollTop = 0; // Safari
document.documentElement.scrollTop = 0; // Chrome, Firefox
}
```
这样，一个美观又实用的“返回顶部”按钮就完成啦！快试试吧，让浏览体验更上一层楼吧！✨