CSS+DIV下拉菜单的制作
纯CSS+DIV布局制作下拉菜单、用了很多网上那种、但是在导航里面加入后会产生滚动条(导航的高度跟下拉菜单的高度不一样就会这样)写简单易懂的、不要JS代码、我的QQ、93...
纯CSS+DIV布局制作下拉菜单、用了很多网上那种、但是在导航里面加入后会产生滚动条(导航的高度跟下拉菜单的高度不一样就会这样)写简单易懂的、不要JS代码、
我的QQ、939910633可以加我跟我详细说下、先谢谢各位 展开
我的QQ、939910633可以加我跟我详细说下、先谢谢各位 展开
4个回答
展开全部
/*导航*/
.dh{height:34px;position:relative;z-index:100;}
.dh ul{list-style:none;}
.dh li {float:left;position:relative;}
.dh ul ul {visibility:hidden;position:absolute;left:0px;top:34px;}
.dh table {position:absolute; top:0; left:0;}
.dh ul li:hover ul,.dh ul a:hover ul{visibility:visible;}
.dh a{display:block;}
.dh a:hover{background:#FF0000;}
.dh ul ul{}
.dh ul ul li {clear:both;text-align:left;font-size:12px;}
.dh ul ul li a{display:block;width:94px;line-height:30px;background:#eb3e45;padding-left:20px;font-size:13px;color:#fff;font-weight:bold;}
.dh ul ul li a:hover{background:#f2cdb0;}
.dh_wz{filter:DropShadow(Color="#646363",OffX="1",OffY="1",Positive="1");}
/*导航 end*/
<!--导航-->
<div class="dh web">
<ul>
<li>
<a href="#"><img src="images/souyei.jpg" /></a> </li>
<li><a href="#"><img src="images/guanyu.jpg" />
<table><tr><td>
<ul>
<li><a href="#">企业文化</a></li>
<li><a href="#">企业介绍</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/canpin.jpg" />
<table><tr><td>
<ul>
<li><a href="#">产品展示</a></li>
<li><a href="#">设备展示</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/yanhua.jpg" />
<table><tr><td>
<ul>
<li><a href="#">设计团队</a></li>
<li><a href="#">设计人员</a></li>
<li><a href="#">作品展示</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/xiwu.jpg" />
<table><tr><td>
<ul>
<li><a href="#">公司新闻</a></li>
<li><a href="#">行业新闻</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/rencai.jpg" /></a> </li>
<li><a href="#"><img src="images/xinxi.jpg" />
<table><tr><td>
<ul>
<li><a href="#">我要留言</a></li>
<li><a href="#">查看留言</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/linxi.jpg" /></a> </li>
<li><a href="#"><img src="images/fudong.jpg" /></a> </li>
</ul>
</div>
<!--导航 结束-->
每个IE都可以!!
.dh{height:34px;position:relative;z-index:100;}
.dh ul{list-style:none;}
.dh li {float:left;position:relative;}
.dh ul ul {visibility:hidden;position:absolute;left:0px;top:34px;}
.dh table {position:absolute; top:0; left:0;}
.dh ul li:hover ul,.dh ul a:hover ul{visibility:visible;}
.dh a{display:block;}
.dh a:hover{background:#FF0000;}
.dh ul ul{}
.dh ul ul li {clear:both;text-align:left;font-size:12px;}
.dh ul ul li a{display:block;width:94px;line-height:30px;background:#eb3e45;padding-left:20px;font-size:13px;color:#fff;font-weight:bold;}
.dh ul ul li a:hover{background:#f2cdb0;}
.dh_wz{filter:DropShadow(Color="#646363",OffX="1",OffY="1",Positive="1");}
/*导航 end*/
<!--导航-->
<div class="dh web">
<ul>
<li>
<a href="#"><img src="images/souyei.jpg" /></a> </li>
<li><a href="#"><img src="images/guanyu.jpg" />
<table><tr><td>
<ul>
<li><a href="#">企业文化</a></li>
<li><a href="#">企业介绍</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/canpin.jpg" />
<table><tr><td>
<ul>
<li><a href="#">产品展示</a></li>
<li><a href="#">设备展示</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/yanhua.jpg" />
<table><tr><td>
<ul>
<li><a href="#">设计团队</a></li>
<li><a href="#">设计人员</a></li>
<li><a href="#">作品展示</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/xiwu.jpg" />
<table><tr><td>
<ul>
<li><a href="#">公司新闻</a></li>
<li><a href="#">行业新闻</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/rencai.jpg" /></a> </li>
<li><a href="#"><img src="images/xinxi.jpg" />
<table><tr><td>
<ul>
<li><a href="#">我要留言</a></li>
<li><a href="#">查看留言</a></li>
</ul>
</td></tr></table>
</a> </li>
<li><a href="#"><img src="images/linxi.jpg" /></a> </li>
<li><a href="#"><img src="images/fudong.jpg" /></a> </li>
</ul>
</div>
<!--导航 结束-->
每个IE都可以!!
展开全部
刚做了一个、我加你QQ吧、纯CSS+DIV代码。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你好,我在网上发给你代码
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2010-05-18
展开全部
这里有一个js的下拉菜单
参考资料: http://www.blueidea.com/common/shoutbox/redir.asp?1=r&id=11931
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询