制作html静态网页如何使用div+css布局,用的dw

如题,不用表格,我要做一个导航栏和表格,怎么用div+css定位位置,注意是相对定位,就是改变页面大小也会随着改变而不是固定不动的,如图全屏时表格是在浅灰色那位置的,窗口化时位置就变成这样了。最好能上代码图,谢谢!
在改变页面大小时那表格就是固定不会动的,小到一定程度时那表格就被挡住了,那表格我是在div里用margin定位的

用百分比来设定各元素的宽度。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
.header{
float:left;
width:100%;
height:auto;
position:relative;
background:#ccc;
}
.header .logo{
float:left;
width:100%;
height:100px;
background:#aaa;
}
.header .logo img{
margin:20px 0 0 100px;
}
.header .menu{
float:left;
width:100%;
position:absolute;
top:100px;
left:0;
background:#bbb;
}
.header .menu ul{
width:100%;
}
.header .menu ul li{
float:left;
width:10%;
height:25px;
line-height:25px;
text-align:left;
list-style:none;
background:#ababab;
}
.header .menu ul li.long{
width:30%;
}
</style>
<body>
<div class="header">
<div class="logo"><img src="images/logo.jpg" width="200" height="65"  /></div>
    <div class="menu">
     <ul>
         <li class="long">234234</li>
            <li>一</li>
            <li>二</li>
            <li>三</li>
            <li>四</li>
            <li>五</li>
        </ul>
    </div>
</div>
</body>
</html>

温馨提示:内容为网友见解,仅供参考
第1个回答  2017-04-14
图在哪里啊追问

一时忘了,图来了

第2个回答  2017-04-14
图在哪里,效果是怎么样的?追问

一时忘了,图来了

追答

使用ul li做导航,能不能吧代码发一下,

追问

追答

使用ul li来实现,table不是特别适合用来做导航

相似回答