Discuz!X3.2 导航鼠标滑过出现二级导航的效果修改方法

hwyzw

    这个主要关注的是X3.2导航鼠标经过时弹出下拉菜单的情况，也就是二级导航的展现方式。今天程龙博要介绍的是系统自带的下拉功能以及样式的调整方法！也许你是刚接触网站建设的新手，或许你还在网上寻找那些杂乱无章的插件，又或者想要亲自实现某种效果，但总是达不到预期，那就赶紧跟下来看看吧！要是觉得有收获，别忘了给程龙博投个票或者点个关注哦！

    方法/步骤

    先弄清楚要怎么做才能实现预期目标，接着在动手改动前，先明确目标内容，这样做有助于后续的调整。

    要显现成效，需先在管理端配置好主分类与子分类，完成调整后才能观察到变化。进入管理端，依次点击登录，在顶部区域找到导航配置，新增主要导航，再增设次要导航。

   

    最后要完成的是一个主要的菜单，接着在这个主要菜单中增加两到三个次要菜单，这样在后续的调整过程中才能清楚地观察到变化。

    这个环节是调整二级导航的外观，也就是图像里箭头所指向的部位，可以设定为两种模式，分别是列表式布局和水平排列布局，这两种布局呈现出的样子我就不赘述了，重点在于图片框内，这个区域应当配置超链接，只有添加了超链接，样式表里的链接元素才能发挥预期作用：

    完成第四个步骤后需要刷新缓存，在前端页面重新加载，这样就能观察到变化了。不过也许你会尝试横向布局却看不到预期结果，不过无需担忧，这个情况可以在源代码里解决，需要找到相应的.css文件，具体位置在那些文件夹里，图片中已经标明了。

   

    接着用启动文档，倘若对这款程序不熟悉，借助文本编辑器也可以，接着借助检索功能，定位到   .p_pop li ，然后在对应的括号区域输入：向左浮动，右边框线为1像素深灰色，左边框线距离内容5像素，右边框线距离内容5像素。

    基本达到这个程度了，若需增添个人化设计，可在图像里的代码部分进行修改，肯定能实现预期样式的（前台那些代码你明白）。

    实践信息仅作参考，如需处理具体事务，特别是涉及法律、医疗等范畴，应当寻求对应行业专家的详尽指导。

    作者表明：这篇文章根据个人实际经历写成，是独立创作，没有获得许可，不允许转述。