div+css下拉导航栏一个小问题

弹出的二级菜单超出<divid="header"></div>的部分就点不到了,怎么处理?还有个问题是选答题,解决后追加50分,就是我想让下拉菜单横着排列,并且永远和"日... 弹出的二级菜单超出<div id="header"></div>的部分就点不到了,怎么处理?
还有个问题是选答题,解决后追加50分,就是我想让下拉菜单横着排列,并且永远和"日志"对齐,怎么弄?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">

</script>
<style type="text/css">

#container{margin:0px auto;width:800px;}
#header{width:800px;height:130px;background:url(fj/bg.gif) repeat-x;}
#daoh{height:102px;
width:800px;}
#nav{
}
#nav ul{margin:0;padding:0;list-style:none;text-align:center;}
#nav ul li{float:left;}
#nav ul li a{text-decoration:none;
height:28px;
width:100px;
background-color:#CC99CC;
color:#9999FF;
font:16px;font-weight:bold;
margin:0 12px 2px 0px;
line-height:24px;
filter:alpha(opacity=20);
opacity:50;
display:block;
}
#nav ul li a:hover{filter:alpha(opacity=100);color:#FFF;}
#nav span{
position:relative;}
#nav li ul li{
float:none;}
#nav li ul{
display:none;}
#nav li:hover ul,.over ul { display:block;}
</style>
</head>

<body><div id="container">
<div id="header">
<div id="daoh"></div>
<div id="nav"><ul>
<li><a href="#"><div><span>日志</span></div></a>
<ul><li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li></ul></li>
<li><a href="#"><span>相册</span></a>
<ul><li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li></ul></li>
<li><a href="#"><span>收藏</span></a>
<ul><li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li></ul></li>
<li><a href="#"><span>留言</span></a>
<ul><li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li></ul></li>
</ul></div>
</div></div>

</body>
</html>
展开
 我来答
xue_seven
推荐于2016-03-06 · TA获得超过262个赞
知道小有建树答主
回答量:315
采纳率:0%
帮助的人:194万
展开全部
不要设置高度就可以了。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="javascript">

</script>
<style type="text/css">
#container{margin:0px auto;width:800px;}
#header{width:800px;background:url(fj/bg.gif) repeat-x;}
#daoh{width:800px;}
#nav{
}
#nav ul{margin:0;padding:0;list-style:none;text-align:center;}
#nav ul li{float:left;}
#nav ul li a,#nav ul li ul li a{text-decoration:none;
height:28px;
width:100px;
background-color:#CC99CC;
color:#9999FF;
font:16px;font-weight:bold;
margin:0 12px 2px 0px;
line-height:24px;
filter:alpha(opacity=20);
opacity:50;
display:block;
}
#nav ul li a:hover{filter:alpha(opacity=100);color:#FFF;}
#nav span{
position:relative;}
#nav ul li li{
float:none;}
#nav ul li ul{
display:none;}
#nav ul li:hover ul,#nav ul li a:hover{ display:block;}
</style>
</head>

<body>

<div id="container">

<div id="header">

<div id="daoh"></div>

<div id="nav">
<ul>
<li><a href="#"><div><span>日志</span></div></a>
<ul>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
</ul>
</li>

<li><a href="#"><span>相册</span></a>
<ul>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
</ul>
</li>

<li><a href="#"><span>收藏</span></a>
<ul>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
</ul>
</li>

<li><a href="#"><span>留言</span></a>
<ul>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
<li><a href="#"><span>123</span></a></li>
</ul>
</li>
</ul>
</div><!--nav -->

</div>
</div>

</body>
</html>
穿皮鞋的青蛙
2010-01-28 · TA获得超过497个赞
知道小有建树答主
回答量:297
采纳率:0%
帮助的人:255万
展开全部
你的代码兼容性不好,不一定在所有的浏览器上都可以正常显示。
去下面的链接,N多下拉菜单,也有我自己写的,也有我找的,你自己去找合适的。

参考资料: http://www.jsweb8.cn/plus/Search/Search.asp?KeyWord=%CF%C2%C0%AD&x=22&y=17

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
yi_mzy
2010-01-28 · 超过34用户采纳过TA的回答
知道答主
回答量:143
采纳率:0%
帮助的人:65.4万
展开全部
加我HI,我发一个很好用的给你
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
dwl5240
2010-01-28 · 超过10用户采纳过TA的回答
知道答主
回答量:143
采纳率:0%
帮助的人:44.3万
展开全部
我的网址里有一个很不错的样式提供免费下载哟

参考资料: http://www.591zqq.cn

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式