首先,需要把在页面排版顶部的标签设置为top
网页中“回到顶部”按钮的样式以及功能的实现:外层用a标签嵌套,内层设置一个div,其中包含一个图片,div设置大小以及背景颜色,然后a标签的position属性设置为fixed,然后right设置20px;bottom设置20px;且href设置此页面顶部标签的id,target设置_self(在本页面打开)(类似于<a href=”#top” target=_self”)这样按钮就处于右下角了,再点击的时候就会回到顶部
制作此按钮的源代码如下:
html代码: <a id="top_back" href="#top" target="_self"> <div> <img src="../img/top-1.png"> <label><strong>top</strong></label> </div> </a> css代码: #top_back{ 40px; position:fixed; right:20px; bottom:20px; text-decoration:none; text-align: center; color:skyblue; } #top_back img{ 100%; }
定位位置可以自己改变
以上
希望对大家有所帮助