【 以下文字转载自 WebDev 讨论区 】
发信人: naiveteage (naiveteage), 信区: WebDev
标 题: 用div代替table的弱问题
发信站: 水木社区 (Fri Mar 19 15:11:50 2010), 站内
如下的html代码实现的效果,如果我在class为tblCol的div中去掉height属性
就无法实现table中的rowspan=*的那种效果了,但设置了height属性的话
则又不够灵活,因为table中每个cell的height可以是自动排版的.
有什么办法处理或改进这个问题呢?
test.html:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
.container {width:500px;height:auto;border:0.2cm groove orange;align:center;}
.headFont {
color:#000000;
line-height:25px;
BORDER-TOP: white 1px solid;
BACKGROUND: #E8E6E3;
BORDER-LEFT: white 1px solid;
padding:3px;
text-align:center;
font-size: 12px;
}
.tblHead {float:left;border:0.2cm groove pink;}
.tblCol {float:left;border:0.2cm groove pink;}
</style>
</head>
<body>
<div class=container>
<div class="tblHead headFont" style="width:30%;">
标题1
</div>
<div class="tblHead headFont" style="width:30%;">
标题2
</div>
<div class="tblHead headFont" style="width:40%;">
标题3
</div>
<div class="tblCol" style="width:30%;height:100;">
11
</div>
<div class="tblCol" style="width:30%;height:50;">
12
</div>
<div class="tblCol" style="width:40%;height:50;">
13
</div>
<div class="tblCol" style="width:30%;height:50;">
22
</div>
<div class="tblCol" style="width:40%;height:50;">
23
</div>
</div>
<body>
</html>
--
修改:naiveteage FROM 211.99.222.*
FROM 211.99.222.*