便捷式返回顶部按钮

xiaohe_qianduan

于 2020-05-28 11:16:52 发布

阅读量204

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/xiaohe_qianduan/article/details/106399812

#back-to-top{
    position:fixed;
    bottom:100px;
    right:60px;
    z-index:133333;
}
#back-to-top a{
    text-align:center;
    text-decoration:none;
    color:#d1d1d1;
    display:block;
    width:50px;
}
#back-to-top a:hover{
    color:#979797;
}
#back-to-top a span{
    /* background:#d1d1d1; */
    border-radius:6px;
    display:block;
    height:50px;
    width:50px;
    background:#d1d1d1 url(../images/arrow-up.png) no-repeat center center;
    margin-bottom:5px;
    -webkit-transition:background 1s;
}
#back-to-top a:hover span{
    background:#979797 url(../images/arrow-up.png) no-repeat center center;
}
<p id="back-to-top"><a href="#top"><span></span></a></p>