在网页设计中，经常会需要实现回到顶部的功能。这时，我们可以使用CSS来实现一个简单的回到顶部按钮，让用户体验变得更好。下面是一段基于CSS的回到顶部代码。 首先，在HTML中加入一个按钮元素，用于返回页面顶部。可以给这个按钮一个id属性，以便后面通过JavaScript来控制它。代码如下：

<button id="back-to-top">返回顶部</button>

接下来，定义CSS样式，让按钮在页面上固定在右下角位置，并隐藏起来。当页面滚动到一定程度时，通过JavaScript来改变按钮的css样式，从而使其显示出来。

/* 按钮样式 */
#back-to-top {
display: none;
position: fixed;
bottom: 20px;
right: 20px;
z-index: 99;
font-size: 18px;
border: none;
outline: none;
background-color: transparent;
color: white;
cursor: pointer;
}
/* 按钮悬停时的样式 */
#back-to-top:hover {
color: yellow;
}
/* 当页面滚动到一定程度时显示按钮 */
@media screen and (min-width: 768px) {
#back-to-top.show {
display: block;
}
}

最后，通过JavaScript来控制按钮的显示与隐藏。当页面滚动距离大于一定值时，添加类名"show"来改变按钮css样式，从而显示出按钮。当返回顶部时，移除类名"show"，隐藏按钮。

/* 当页面滚动时，控制按钮的显示与隐藏 */
window.onscroll = function() {
scrollFunction();
};
function scrollFunction() {
if (document.body.scrollTop >20 || document.documentElement.scrollTop >20) {
document.getElementById("back-to-top").classList.add("show");
} else {
document.getElementById("back-to-top").classList.remove("show");
}
}
/* 返回顶部 */
function topFunction() {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}

以上就是基于CSS实现回到顶部功能的代码，通过CSS样式来控制按钮的位置和状态，再结合JavaScript来控制按钮的显示与隐藏，实现回到顶部的功能。如果您也需要实现回到顶部的功能，这段代码可以帮助您快速实现。