左边的DIV设定了固定的宽度，右边的DIV如何自适应地填满剩下的屏幕宽度？自适应是为了满足不同电脑的分辨率。我已经设定了DIV等高了。<style type="text/css">/*CSS部分*/*{margin:0;padding:0;font-family:"微软雅黑";} /*去除默认间隔，设定全部字体为微软雅黑*/body{background-image: url(images/wooden.jpg); background-repeat:no-repeat; background-size:cover; -moz-background-size: cover;} /*网页背景*/#sidebar{width: 210px; height:auto; background-color: #ebb058;float:left; position: fixed; }#container{width: auto;height: auto;border: 2px solid #400080;margin-left: 210px; float: left; position: absolute;}</style><!--HTML部分--><body><!--div盒子模型 --><div id="sidebar"><!--左边的DIV--></div><div id="container"><!--右边的DIV--></div><!--javascript部分--><!--div等高-->document.getElementById("sidebar").style.height = document.getElementById("container").offsetHeight + "px";</script></body>
2 回答
一只萌萌小番薯
TA贡献1795条经验 获得超7个赞
无需js、无需浮动，直接用CSS即可搞定这样的布局，主要代码如下：
#sidebar, #container {min-height:400px; /* 视具体情况 */}#sidebar {width:210px; background-color:#ebb058; position:absolute; top:0; left:0;}#container {margin-left:210px; border:2px solid #400080;} |
梵蒂冈之花
TA贡献1900条经验 获得超5个赞
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{margin: 0;}
body{
width: 100%;
height: 100%;
}
.l{
float: left;
width: 131px;
height: 45px;
background-color: #aaa;
}
.r{
height: 45px;
background-color: #0f0;
}
</style>
</head>
<body>
<div>左</div>
<div>右</div>
</body>
</html>
- 2 回答
- 0 关注
- 583 浏览
添加回答
举报
0/150
提交
取消