html+css做的二级菜单影响到下面的DIV了，求解？
在网上查了好像是什么绝对定位和相对定位，我生手，始终弄不出来，求大神支招帮我改下代码并改后帮我备注下改了的地方！<stype>*{margin:0px;}body{bac...
在网上查了好像是什么绝对定位和相对定位，我生手，始终弄不出来，求大神支招帮我改下代码并改后帮我备注下改了的地方！
<stype>
*{margin:0px;}
body{background-image:url();
background-attachment:fixed;
}
#header{width:990px;
height:120px;
margin-left:auto;
margin-right:auto;
background:url()
}
#logo{
width:150px;
height:100px;
margin:10px 0px 0px 10px;
float:left;
}
#name{
width:820px;
height:100px;
margin:10px 0px 0px 10px;
float:right;
}
/*以上是header部分*/
#navigation-bar{
width:auto;
height:50px;
margin-top:2px;
color:#FFFFFF;
background-image:url()
}
#center{
width:990px;
height:50px;
margin:0px auto;
}
ul{
margin:0px;
padding:0px;
}
#center ul li{
float:left;
width:141px;
height:50,px;
list-style:none;
line-height:50px;
text-align:center;
}
#center ul li:hover{
background-image:url()
}
#center ul li ul li{
position:relative;
left:0px; top:0px;
display:none;
}
#center ul li:hover ul li{
display:block;
}
/*以上是导航栏*/
#focus-picture{width:990px; height:300px;}
</stype>
<div id="header">
<div id="logo"><img src=""></div>
<div id="name"><img src=""></div>
</div>
<div id="navigation-bar">
<div id="center">
<ul>
<li>首页</li>
<li>简介</li>
<li>名片
<ul>
<li>商务</li>
<li>简约</li>
<li>创意</li>
</ul>
</li>
<li>灯箱
<ul>
<li>落地式</li>
<li>挂墙式</li>
<li>房顶式</li>
</ul>
</li>
<li>画册</li>
<li>其它
<ul>
<li>海报</li>
<li>手提袋</li>
<li>动画</li>
<li>T恤衫</li>
</ul>
</li>
<li>联系</li>
</ul>
</div>
</div>
<div id="focus-picture">1</div>
<div id="body"></div> 展开
<stype>
*{margin:0px;}
body{background-image:url();
background-attachment:fixed;
}
#header{width:990px;
height:120px;
margin-left:auto;
margin-right:auto;
background:url()
}
#logo{
width:150px;
height:100px;
margin:10px 0px 0px 10px;
float:left;
}
#name{
width:820px;
height:100px;
margin:10px 0px 0px 10px;
float:right;
}
/*以上是header部分*/
#navigation-bar{
width:auto;
height:50px;
margin-top:2px;
color:#FFFFFF;
background-image:url()
}
#center{
width:990px;
height:50px;
margin:0px auto;
}
ul{
margin:0px;
padding:0px;
}
#center ul li{
float:left;
width:141px;
height:50,px;
list-style:none;
line-height:50px;
text-align:center;
}
#center ul li:hover{
background-image:url()
}
#center ul li ul li{
position:relative;
left:0px; top:0px;
display:none;
}
#center ul li:hover ul li{
display:block;
}
/*以上是导航栏*/
#focus-picture{width:990px; height:300px;}
</stype>
<div id="header">
<div id="logo"><img src=""></div>
<div id="name"><img src=""></div>
</div>
<div id="navigation-bar">
<div id="center">
<ul>
<li>首页</li>
<li>简介</li>
<li>名片
<ul>
<li>商务</li>
<li>简约</li>
<li>创意</li>
</ul>
</li>
<li>灯箱
<ul>
<li>落地式</li>
<li>挂墙式</li>
<li>房顶式</li>
</ul>
</li>
<li>画册</li>
<li>其它
<ul>
<li>海报</li>
<li>手提袋</li>
<li>动画</li>
<li>T恤衫</li>
</ul>
</li>
<li>联系</li>
</ul>
</div>
</div>
<div id="focus-picture">1</div>
<div id="body"></div> 展开
4个回答
展开全部
你试一下，我没看到下面的那个div被影响了。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<title>新建网页</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
*{margin:0px;}
body{background-image:url();
}
#header{width:990px;
height:120px;
margin-left:auto;
margin-right:auto;
background:green;
}
#logo{
width:150px;
height:100px;
margin:10px 0px 0px 10px;
float:left;
}
#name{
width:820px;
height:100px;
margin:10px 0px 0px 10px;
float:right;
}
/*以上是header部分*/
#navigation-bar{
width:auto;
height:50px;
margin-top:2px;
color:black;
background-image:url()
}
#center{
width:1000px;
height:50px;
margin:0px auto;
}
ul{
margin:0px 5px;
padding:0px;
list-style: none;
}
#center ul li{
float:left;
width:141px;
height:48px;
line-height:50px;
text-align:center;
background:yellow;
/*border:1px solid black;*/
}
#center ul li:hover{
background-image:url()
}
#center ul li ul li{
position:relative;
left:0px; top:0px;
display:none;
}
#center ul li:hover ul li{
display:block;
}
/*以上是导航栏*/
#focus-picture{width:990px; height:300px;
background:red; margin:2px auto;
}
</style>
</head>
<body>
<div id="header">
<div id="logo"><img src=""></div>
<div id="name"><img src=""></div>
</div>
<div id="navigation-bar">
<div id="center">
<ul>
<li>首页</li>
<li>简介</li>
<li>名片
<ul>
<li>商务</li>
<li>简约</li>
<li>创意</li>
</ul>
</li>
<li>灯箱
<ul>
<li>落地式</li>
<li>挂墙式</li>
<li>房顶式</li>
</ul>
</li>
<li>画册</li>
<li>其它
<ul>
<li>海报</li>
<li>手提袋</li>
<li>动画</li>
<li>T恤衫</li>
</ul>
</li>
<li>联系</li>
</ul>
</div>
</div>
<div id="focus-picture">1</div>
<div id="body"></div>
</body>
</html>
更多追问追答
追问
只要二级伸开，下面的DIV就被撑跑了
追答
你用是什么浏览器？
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
#center ul li{
float:left;
width:141px;
height:50px;
color: #000;
list-style:none;
line-height:50px;
text-align:center;
}
#center ul li:hover{
background-image:url()
}
#center ul li ul{
display:none;
position:relative;
left:0px; top:0px;
border: 1px solid #ccc;
border-bottom: none;
}
#center ul li ul li {
float: none;
border-bottom: 1px solid #ccc;
}
#center ul li:hover ul {
display: block;
}
/*以上是导航栏*/
替换一下CSS就OK了
追问
大神，我替换了二级菜单都没用了，你邮箱或者是QQ多少？我发给你帮我改下！
追答
373687921
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你下面的那个div是不是也给float属性了？去掉再看看
追问
没给
追答
方便发源文件给我看看么，qq274276153
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<div style="clear:both;"></div>
<div id="focus-picture">1</div>
在前面加一个清楚浮动的div可以吗
<div id="focus-picture">1</div>
在前面加一个清楚浮动的div可以吗
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
