关于CSS float的问题 导航不在header这个框中,这是为什么
发布网友
发布时间:2022-04-20 21:16
我来回答
共1个回答
热心网友
时间:2022-04-20 22:45
你给你的header加个高度,你就可以看见,导航是在header里面的。
当你用浮动的时候,如果你定义的标签没有高度(也没有内容)的时候,下面的标签是会顶上去的,这时候会看到重合的现象。话说你的代码总体是写得比较规范的,只是对标签的属性定义的时候还缺少经验,这是刚入门比较常见的问题,有了良好的习惯,多遇到这种问题,处理多一些。div+css你也就基本掌握了
<html>
<head>
<title></title>
<style type="text/css">
<!--
body {margin:2px auto; padding:0;}
#wrap {width:776px;height:100%; margin:0 auto; border:1px solid #FFCC00;}
#header {margin:0 auto; border:1px solid black; height:150px;}
#center { }
#bottom { }
#header ul {margin:0px auto; width:400px; height:30px;}
#header li {border:1px solid black; width:50px; height:20px;float:left; list-style:none; margin-left:4px;text-align:center;}
-->
</style>
</head>
<body>
<div id="wrap">
<div id="header">
<div id="lizi">
<ul>
<li>首页</li>
<li>百度</li>
<li>新浪</li>
<li>谷歌</li>
<li>网易</li>
</ul>
</div>
</div>
<div id="center"> </div>
<div id="bottom"> </div>
</div>
</body>
</html>
可能调的不是你的意思,不过要改的话就很容易了。。。你自己慢慢改改,多查资料
推荐www.w3school.com.cn