立即注册 找回密码

QQ登录

只需一步,快速开始

Discuz!X3.2(二级导航)导航下拉菜单样式修改的具体方法

2017-10-29 10:36| 发布者: 猪八戒| 查看: 903| 评论: 0

摘要: 真个针对的是Discuz!X3.2导航鼠标滑过出现下拉菜单的经验,也就是出现二级导航。而今天程龙博将分享系统自带的下拉效果和样式修改!可能你是新站长,可能你还在网蒙头去找那些乱七八糟的插件,或者想自己添加效果, ...
真个针对的是discuz!X3.2导航鼠标滑过出现下拉菜单的经验,也就是出现二级导航。而今天程龙博将分享系统自带的下拉效果和样式修改!可能你是新站长,可能你还在网蒙头去找那些乱七八糟的插件,或者想自己添加效果,但是都不能出现想要的效果,那就快了学习一下吧!如果感觉不错记得给程龙博投票或者关注哦!
首先我们先来确定一下要做到什么样才能到达自己想要的效果,而在修改之前我们先来看一下目标吧!这样方便接下来的修改:

想要看到效果首先就是现在后台添加好一级栏目和二级栏目,这样做出更改以后才能看到效果。打开后台---登录---选择左上方界面----导航设置---添加主导航---添加二级导航

最终的效果就是添加一个主导航然后再在主导航里添加两三个二级导航,这样在你接下来的修改才能看到明显的效果。

这一步就是设置二级导航的样式,也就是图片的箭头所指的位置,这里可设置成1、菜单样式,2、横排样式,两种效果,这两种效果具体什么样的我就不说了,在这主要是图片中框中的,这里最好有链接,加上链接后样式文件中的a才能起到相应的效果:

做完第四步后更新一下缓存,到前台刷新一下就能看到效果了。但是你很可能选择横排发现没效果,但是不用担心,这个问题你可以去源码中实现,找到common.css文件(图片中已经显示中去那些文件夹里找)

然后用DW打开文件(如果你不知道这个软件就用记事本打开也行),用查找工具找到   .p_pop li   然后在后面的括号内加上: float:left; border-right:1px solid #666; padding-left:5px; padding-right:5px; 

做到这一步基本上就完成了,如果你还想要加一下自己想要的效果的话可以在图片中的代码中更改,绝对能达到你想要的效果的(前台你懂那些代码)。



鲜花

握手

雷人

路过

鸡蛋

最新评论

!jz_fbzt! !jz_lxwm! !jz_gfqqq!

关于我们|手机版|小黑屋|地图|【道勤网】-www.daoqin.net 软件视频自学教程|免费教程|自学电脑|3D教程|平面教程|影视动画教程|办公教程|机械设计教程|网站设计教程 ( 皖ICP备15000319号-1 )

GMT+8, 2024-12-23 22:32

Powered by DaoQin! X3.4 © 2016-2063 Dao Qin & 道勤科技

返回顶部