腾讯云服务器优惠活动华纳云香港服务器
boke112百科 » Z-Blog » 正文

zblogphp的导航栏如何添加无链接的一级菜单?

默认情况下 Z-BlogPHP 的导航栏菜单都是带有链接地址的,那么我们如何添加无链接的一级菜单呢?首先我们来看看正常的 zblogphp 的导航菜单代码。只需要登录 Z-BlogPHP 站点后台 – 模块管理 – 导航栏,在正文中即可看到导航栏菜单的代码,具体如下:

<li id="nvabar-item-index"><a href="http://localhost/"><i class="fa fa-home" aria-hidden="true"></i> 首页</a></li>
<li><a href="http://localhost/category-1.html"><i class="fa-fire fa"></i> boke112 导航</a><ul class="sub-menu"> <li id="navbar-page-2"><a href="http://localhost/2.html"><i class="fa fa-user" aria-hidden="true"></i> 个人档案</a></li></ul></li>

以上菜单代码是含有个性化图标,仅做参考。

比如我们将上述代码中带有二级菜单的一级菜单“boke112 导航”改为无链接,那么只需要将它所对应的 href=”http://localhost/category-1.html”去掉即可。修改之后的代码如下:

<li id="nvabar-item-index"><a href="http://localhost/"><i class="fa fa-home" aria-hidden="true"></i> 首页</a></li>
<li><a><i class="fa-fire fa"></i> boke112 导航</a><ul class="sub-menu"> <li id="navbar-page-2"><a href="http://localhost/2.html"><i class="fa fa-user" aria-hidden="true"></i> 个人档案</a></li></ul></li>

效果如下:

zblogphp的导航栏如何添加无链接的一级菜单?-第1张-boke112百科(boke112.com)

如果直接去掉一级菜单“boke112 导航”的 A 标签,那么就不会上图红色箭头所对应的“倒三角”效果,这个标识说明是该菜单带有二级菜单。

PS:以上代码及效果是以 zblogPHP 版本的 Blogs 主题为例进行说明,其他主题的一级和二级菜单效果及样式请自行折腾。

拓展阅读

本文地址:https://boke112.com/post/5996.html

赞 (0) 打赏
版权声明:本文为原创文章,版权归 boke112百科 所有,欢迎分享本文,转载请保留出处!发布此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请联系我们,确认后马上更正或删除,谢谢!
香港云主机55元/年
wu