给网站在做导航条的时候,如何将二级栏目做成三级栏目,有什么方法步骤?
答案:1 悬赏:0 手机版
解决时间 2021-01-24 23:22
- 提问者网友:世勋超人
- 2021-01-24 15:47
给网站在做导航条的时候,如何将二级栏目做成三级栏目,有什么方法步骤?
最佳答案
- 五星知识达人网友:话散在刀尖上
- 2021-01-24 16:21
你说的这个和下拉列表是一个含义。所谓的二级导航栏目是我们跟据一级栏目进行细分的。这个就相当于:
1级导航:首页——(动物、植物)
2级导航:动物——(熊猫、灵猫)
3级导航:熊猫——简介、生活习性、地区分布、
按这样的枝叶分下来的。当然,这样比较麻烦,我们可以将css+div和气来运用,用代码显示
css代码片段
*{margin:0;padding:0;border:0;background-repeat:no-repeat;font-size:14px;list-style-type:none;color:#F5F5F5;}
a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}
.navgation{width:100%;height:36px;line-height:36px;background:#000;margin:10pxauto;}
.nav{width:960px;height:36px;margin:0auto;}
.navli{float:left;width:130px;border-right:#FFFsolid2px;text-align:center;}
.nav.last{border-right:none;}
html代码片段
首页
动物
植物
下面就是下拉的列表框,也就是平时我们说的二级导航栏目(这里,我们就用熊猫来做下面的下拉列表导航栏目的制作)
熊猫
css片段
.nava{display:block}
.nava:hover{display:block;background:#F00}
.navul{display:none;}
.navli:hoverul{display:block;position:absolute;width:130px;top:46px;background:#069;}
.navli:hoverulli{border-bottom:#99C1pxsolid;border-right:none;}
1级导航:首页——(动物、植物)
2级导航:动物——(熊猫、灵猫)
3级导航:熊猫——简介、生活习性、地区分布、
按这样的枝叶分下来的。当然,这样比较麻烦,我们可以将css+div和气来运用,用代码显示
css代码片段
*{margin:0;padding:0;border:0;background-repeat:no-repeat;font-size:14px;list-style-type:none;color:#F5F5F5;}
a:link{text-decoration:none;}
a:visited{text-decoration:none;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}
.navgation{width:100%;height:36px;line-height:36px;background:#000;margin:10pxauto;}
.nav{width:960px;height:36px;margin:0auto;}
.navli{float:left;width:130px;border-right:#FFFsolid2px;text-align:center;}
.nav.last{border-right:none;}
html代码片段
下面就是下拉的列表框,也就是平时我们说的二级导航栏目(这里,我们就用熊猫来做下面的下拉列表导航栏目的制作)
- 熊猫首页
- 简介
- 生活习性
- 地区分布
css片段
.nava{display:block}
.nava:hover{display:block;background:#F00}
.navul{display:none;}
.navli:hoverul{display:block;position:absolute;width:130px;top:46px;background:#069;}
.navli:hoverulli{border-bottom:#99C1pxsolid;border-right:none;}
我要举报
如以上问答信息为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
大家都在看
推荐资讯