织梦cms如何制作二级导航菜单,大家可以根据下面的标签试一下。
一级导航源码(head.htm)如下:
<!– 导航 –>
<div id="nav">
<ul>
<li class="w1">
<a href='{dede:global.cfg_cmsurl/}/'>
<p>主页</p>
</a>
</li>{dede:channel type='top' row='10' currentstyle="
<li class='w1'>
<a href='~typelink~' ~rel~>
<p>~typename~</p>
</a>
</li>"}
<li class="w1">
<a href='[field:typeurl/]' [field:rel/]>
<p>[field:typename/]</p>
</a>
</li>{/dede:channel}</ul>
</div>
首先导入原来用于底部友链的javascript文件:
<script type='text/javascript' src='{dede:global.cfg_cmsurl/}/images/js/dropdown.js'></script>
然后将导航部分代码改为:
<div id="nav">
<ul>
<li class="w1">
<a href='{dede:global.cfg_cmsurl/}/'>
<p>主页</p>
</a>
</li>{dede:channel type='top' row='10'}
<li class="w1">
<a href='[field:typeurl/]' [field:rel/]>
<p>[field:typename/]</p>
</a>
</li>{/dede:channel}</ul>
<ul>
<div style="clear:both;"></div>{dede:channelartlist typeid='top' cacheid='channelsonlist'}
<ul id="dropmenu{dede:field.typeid/}" class="dropMenu">{dede:channel type='son' noself='yes'}
<li class="dropMenu">
<a href="[field:typelink/]">[field:typename/]</a></li>{/dede:channel}</ul>{/dede:channelartlist}</ul>
</div>
<script type="text/javascript">cssdropdown.startchrome("nav")</script>
最后把下面的CSS代码加到你原有的CSS文件中就大功告成了:
.dropMenu {
background: url("img/snav.jpg") repeat – x scroll 0 0 transparent;
width: 1024px;
height: 31px;
}.dropMenu ul li {
height: 16px;
background: #fff
}.dropMenu li {
height: 16px;
background: #fff
}.dropMenu a {
width: auto;
display: block;
color: #000;
padding: 2px 0 2px 2px;
background: #fff
}.dropMenu a: hover {
color: red;
text – decoration: underline;
}
远离javascript/jquery纯css3实现多级导航栏联动
标签: 导航
上面是“织梦cms如何制作二级导航菜单”的全面内容,想了解更多关于 织梦cms 内容,请继续关注web建站教程。
当前网址:https://ipkd.cn/webs_656.html
workflows工作流
- 一个女人站在海边的岩石上,飞来一只鸟
- 半透明的玻璃苹果ComfyUI工作流
- 一个超现实和超现实的场景,在森林中心有一座蛇形的房子
- 一幅骨架坐在公园的长椅上
- 一只可爱的快乐老鼠戴着帽子ComfyUI工作流
- 一张精心制作的熊岛复古地图ComfyUI工作流
- 图生图生成动漫效果ComfyUI工作流
- 一个外国人在吹奏萨克斯ComfyUI工作流
猜你喜欢
声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!