一个纯CSS写的返回顶部按钮组
更新日期:2024-10-29 14:55:13 来源:网络
- HTML代码:
<div class="gotop">
<ul>
<li><a id="goTopBtn" href="#"><i class="icon iconfont"></i><em>返回顶部</em></a></li>
<li><a href="#"><i class="icon iconfont"></i><em>上一文章</em></a></li>
<li><a href="#"><i class="icon iconfont"></i><em>下一文章</em></a></li>
<li><a target="_blank" href="#"><i class="icon iconfont"></i><em>官方客服</em></a></li>
<li><a href="#" class="user" target="_blank"><i class="icon iconfont"></i><em>个人中心</em></a></li>
</ul>
</div>
- CSS代码:
.gotop {
position: fixed;
top: 50%;
left: 50%;
margin-left: 600px;
margin-top: -125px;
}
.gotop li a {
display: block;
width: 30px;
height: 30px;
border-bottom: 1px solid #000;
background-color: #333;
color: #fff;
line-height: 15px;
padding: 10px;
text-align: center;
}
.gotop li a.user {
border: 0;
}
.gotop li a i {
line-height: 30px;
font-size: 20px;
}
.gotop li a em {
display: none;
}
.gotop li a:hover {
background-color: #3398cc;
color: #fff;
}
.gotop li a:hover i {
display: none;
}
.gotop li a:hover em {
display: block;
font-style: normal;
}
- PbootCMS模板调用友情链接标签代码(1)_1
- 修改数据库密码后访问Discuz!论坛报错Discuz!Database Error
- Dedecms备份的数据文件位置及备份数据库的方法
- 织梦title字数限制的两种方法
- PbootCMS编辑器过滤div代码解决办法(1)_1
- 织梦生成报错读取频道信息失败的解决方法
- 帝国CMS修改栏目顺序提示:您来自的链接不存在
- 去除织梦img中的style width height属性方法
- PbootCMS网站百度site网址异常的解决办法(1)_1
- 网站搬家时导入SQL Server备份文件失败
- 网站admin密码忘记了怎么办
- 易优cms搜索结果页如何统计关键词文章数量
- 网站源码安装后访问首页,页面错乱的处理方法
- pbootcms模板如何做好防护
- pbootcms如何设置发布内容不自动提取缩略图(1)
- PBOOTCMS中新增并开启手机端模板,以便为用户提供更好的移动设备浏览体验
- Pbootcms留言“提交成功”的提示语修改(1)
- pbootcms网站后台登录提示:”登录失败:数据库目录写入权限不足!“
- 错误内容:You have an error in your SQL syntax; check the manual that corresponds to your MySQL server ve
- 易优cms数据表或视图不存在,请联系技术处理。
- 织梦网站admin密码忘记了怎么办
- ZBlog网站自定义单页_支持动态和静态页面生成
- imagecreatefrompng(): gd-png: libpng warning: iCCP: known incorrect sRGB profile
- 升级完后网站提示500错误怎么办
- 易优CMS文章内容页如何获取上一篇下一篇
- PbootCMS全站模板date时间标签/时间格式常见的8种调用方式
- 易优CMS网站插件:会员邀请插件介绍
- 易优cms网站后台登录不上
- SQLSTATE[HY000] [1045] Access denied for user 'cs2021'@'localhost' (using passwo
- 易优CMS资源文件加载设置与调用标签