本站之前是用的CoolBlog模版，后来由于该模版BUG太多，无法接受，就换到了card。

在这之后，我就开始对这款模版进行美化，细心的朋友可以发现，目前的主题样式比较原版是有很大区别的。

其中就包括置顶、最新、热门、登陆、代码复制、代码高亮、版权声明等等。

要不是这款主题核心文件是加密的，我都想大改特改，可惜木得办法，可以进行二开的部分太少了。

好了，不说废话了，接下来奉上相关代码。

CSS部分

/* 返回顶部底部 */
#gotop {
 width:40px;
 height:auto;
 z-index:1021;
 position:fixed;
 bottom:8%;
 left:50%;
 margin-left:638px;
 margin-bottom:0px;
 border:0px;
 background-color:transparent
}
#gotop a#goToBottom {
 border-radius:5px 5px 0 0;
}
#gotop a#goTopBtn {
 border-radius:0 0 5px 5px;
 border-bottom:0px;
}
#gotop a {
 color:#a5a7a8;
 border:0px;
 border-bottom:1px solid #f0f3f9;
 font-size:20px;
 background:#fff;
 display:inline-block;
 width:40px;
 height:40px;
 line-height:40px;
 text-align:center;
}
#gotop a:hover {
 color:#fff;
 background-color:#1979ff;
 text-decoration:none;
 border:0px;
}

@media(max-width:768px),@media(max-width:576px) {
 #gotop {
  left:auto;
  right:-3px;
 }
 #gotop a#goTopBtn {
  border-radius:5px!important;
  background:rgba(191, 191, 191, 0.5);
  color:#ffffff;
  width:80%;
  height:30px;
  line-height:30px;
 }
 #gotop a#goTopBtn:link {
  text-decoration:none;
 }
   #gotop a#goToBottom {
  border-radius:5px!important;
  background:rgba(191, 191, 191, 0.5);
  color:#ffffff;
  width:80%;
  height:30px;
  line-height:30px;
 }
 #gotop a#goToBottom:link {
  text-decoration:none;
  margin-bottom: 5px;
 }
}

Html部分

<div id="gotop">
<a href="javascript:void(0);" id="goToBottom" title="直达页尾">尾</a>
<a href="javascript:void(0);" id="goTopBtn" title="返回顶部">顶</a>
</div>

<script>
$("#goTopBtn").click(function(){$("html,body").animate({scrollTop:0},500)});
$('#goToBottom').click(function(){
$('html,body,.footer').animate({scrollTop:$(document).height()},900);
return false;
});
</script>

emmm，我想代码怎么放就不用我过多赘述了吧......

PS：代码是扒的某个Xiuno论坛（狗头）

效果图

参考本站就好啦～(￣▽￣～)(～￣▽￣)～