layui中怎么去掉导航下的横线layui-nav-bar

layui是一款灰常不错的ui框架,快速开发高大尚的后台界面那么在我们开发的过程中列如想去掉导航下的横线layui-nav-bar的显示怎么办?

查找代码并且替换成下面的f="layui-nav-item",l="layui-nav-bar"
替换成f="layui-nav-item",l="xxx"就行了,

实现要求即可,没必要去细研究

由于整体来说这个<span class="layui-nav-bar">是通过js来实现的,mouseover等效果,所以我们只需要吧上面的代码在layui.js中去掉就行了

实则上面这么改是有bug的由于上面仅仅事把样式换掉了,没有彻底解决,如下方法也可以

对导航元素结构设定可选属性和 CSS 类名,可让导航菜单项达到不同效果。目前支持的属性如下:
属性名     可选值     说明
lay-shrink  

    空值(默认)
    不收缩兄弟菜单子菜单
    all
    收缩全部兄弟菜单子菜单

    展开子菜单时,是否收缩兄弟节点已展开的子菜单 (注:layui 2.2.6 开始新增)
如:<ul class="layui-nav layui-nav-tree" lay-shrink="all"> … </ul>
lay-unselect    无需填值    点击指定导航菜单时,不会出现选中效果(注:layui 2.2.0 开始新增)
如:<li class="layui-nav-item" lay-unselect>刷新</li>
lay-bar     

    disabled
    禁用滑块跟随功能

    在导航菜单主容器中配置,如:
<div class="layui-nav" lay-bar="disabled"> </div>
CSS 类   

    layui-nav-child-c
    子菜单居中对齐
    layui-nav-child-r
    子菜单向右对齐

    直接在子菜单标签配置即可,如:

</>

    <dl class="layui-nav-child layui-nav-child-c">
      …
    </dl>

    上述两项为 layui 2.6.6 开始新增 

看官方的文档吧里面有介绍

© 版权声明
THE END
如果内容对您有所帮助,就支持一下吧!
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容