<!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=gb2312" />
<title>无标题文档</title>
<style type="text/css">
body{ margin:0; padding:0; text-align:center; font-size:40px; font-weight:bold}
.top{ height:100px; background:#003366}
.sup{ height:500px; width:200px; background:#33FF99;float:left}
.zi{height:500px; background:#999999;margin:0 200px 0 200px}
.apc{ height:500px;width:200px; background:#FF3399;float:right}
.zhong{ height:100px;width:800px; background:#990066}
.main{width:800px;height:500px; margin:0 auto}
</style>
</head>
<body>
<div class="top">top</div>
<div class="main">
<div class="sup">sup</div>
<div class="apc">apc</div>
<div class="zi">zi</div>
</div>
<div class="zhong">zhong</div>
</body>
</html>
把如上代码复制打开,会发现
<div class="main">
<div class="sup">sup</div> (1)
<div class="apc">apc</div> (2)
<div class="zi">zi</div> (3)
</div>
中间的块级元素颜色依次是绿灰红,
为什么只有按顺序输入(1)(2)(3)才会显示这样的页面, 如果更改了1、2、3的顺序,网页显示中的DIV元素就会出现换行
小小小小哒