日期:2014-05-17  浏览次数:20585 次

div如何自适应宽度
HTML code

<div id="main">
<div style="width:200px;float:left;background:#f00;">固定宽度<div>
<div style="float:left;background:#ff0;">要如何让这个div的宽度自由随着main的宽度自动变化呢</div>
</div>

<table width=100%>
<tr>
<td width=200>用table就可能很方便实现</td>
<td>用div要怎么做呢</td>
</tr>
</table>



特注: 不能用js来实现

------解决方案--------------------
<div style="width:200px;float:left;background:#f00;">固定宽度<div>
<div style="float:left;margin-left:200px;background:#ff0;">要如何让这个div的宽度自由随着main的宽度自动变化呢</div>

------解决方案--------------------
HTML code

<!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>
<style type="text/css">
.div1{background:#f00;width:200px;float:left;}
.div2{background:#ff0;margin-left:200px;}
</style>
</head>

<body>
<div id="main">
<div class="div1">固定宽度</div>
<div class="div2">要如何让这个div的宽度自由随着main的宽度自动变化呢</div>
</div>
</body>
</html>