制作html静态网页如何使用div+css布局,用的dw
如题,不用表格,我要做一个导航栏和表格,怎么用div+css定位位置,注意是相对定位,就是改变页面大小也会随着改变而不是固定不动的,如图全屏时表格是在浅灰色那位置的,窗口...
如题,不用表格,我要做一个导航栏和表格,怎么用div+css定位位置,注意是相对定位,就是改变页面大小也会随着改变而不是固定不动的,如图全屏时表格是在浅灰色那位置的,窗口化时位置就变成这样了。最好能上代码图,谢谢!
在改变页面大小时那表格就是固定不会动的,小到一定程度时那表格就被挡住了,那表格我是在div里用margin定位的 展开
在改变页面大小时那表格就是固定不会动的,小到一定程度时那表格就被挡住了,那表格我是在div里用margin定位的 展开
3个回答
展开全部
用百分比来设定各元素的宽度。
<!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>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询