7b2主题美化-移动端底部导航修改美化

jaysun

移动端现在是网站使用的主流方向,移动端的美化牵扯网站的使用体验,7b2主题移动端美化底部导航栏,可以快速找到相应的内容,这个跟子比主题移动端的底部导航条非常的相似。

效果图:

1.jpg

使用教程:

修改

b2/Assets/fontend/mobile.css   中

.mobile-footer-menu.footer-fixed 内容(覆盖原{}中内容)   (宝塔编辑本文中使用搜索即可找到)大概在1153行

.mobile-footer-menu.footer-fixed {position: fixed;padding-bottom: calc(env(safe-area-inset-bottom) + 6px);}一键复制



.mobile-footer-menu 内容(覆盖原{}中内容) (宝塔编辑本文中使用搜索即可找到)大概在2088行


.mobile-footer-menu {box-shadow: 0 -1px 3px 0 rgba(26,26,26,.1);padding: 5px;z-index: 5;flex-flow: nowrap;display: flex;justify-content: space-between;}一键复制



.mobile-footer-menu 内容(覆盖原{}中内容) (宝塔编辑本文中使用搜索即可找到)大概在1163行


.mobile-footer-menu {transform: translate(0);transition: transform .5s,background-color .5s ease-out;box-sizing: border-box;left: 0;right: 0;background: rgba(255, 255, 255, 0.9);border-radius: 12px;margin: 0 auto;width: 90%;bottom: 10px;}一键复制



.mobile-footer-menu .mobile-footer-center button i 内容(覆盖原{}中内容) (宝塔编辑本文中使用搜索即可找到)大概在2110行


隐藏内容
评论可见
前往评论



您需要 登录账户 后才能发表评论

发表评论

快捷回复: 表情:
评论列表 (有 3 条评论,142人围观)
网友昵称:Aaron
Aaron V 普通用户 Google Chrome 92.0.4515.107 Windows 10 x64 板凳
01-03 来自广东 回复
不错哦。
网友昵称:dmy
dmy V 普通用户 Google Chrome 108.0.0.0 Windows 10 x64 椅子
2022-12-31 来自福建 回复
试试
网友昵称:paopao123
paopao123 V 普通用户 Google Chrome 108.0.0.0 Windows 10 x64 沙发
2022-12-30 来自内蒙古 回复
我看看

目录[+]

取消
微信二维码
微信二维码
支付宝二维码