我正在尝试布局一个包含四列的表:第1列单元格深达6行;第2列单元格为六行深;第3列包含一个深四行的单元格,以及一行深的2个单元格;第4列包含一个三行深的单元格和一行深的单元格,列中的最后两个单元格为空且未指定 .
ABCD
ABCD
ABCD
ABCE
ABFx
ABGx
我试着遵循我认为这样做的规则,即:第一行<tr>包含第一行中所有内容的<td>;第二个<tr>包含<td>(s)来填充第一个非指定列的列[在这种情况下称为“E”的单元格],接下来的两个<tr>包含一个< td>每个用于“F”和“G” .
以下代码是我的尝试:
<table border='1'>
<tr>
<td rowspan='6'>A
A
A
A
A<br>A</td>
<td rowspan='6'>B
B
B
B
B<br>B</td>
<td rowspan='4'>C
C
C
C</td>
<td rowspan='3'>D
D
D</td>
</tr>
<tr>
<td>E</td>
</tr>
<tr>
<td>F</td>
</tr>
<tr>
<td>G</td>
</tr>
</table>
这给了我:
ABCDx
ABCDx
ABCDE
ABCDF
ABCGx
如果我用不需要的列“引导它”:
1ABCD
2ABCD
3ABCD
4ABCE
5ABF
6ABG
使用:
<table border='1'>
<tr>
<th>1</th>
<td rowspan='6'>A
A
A
A
A<br>A</td>
<td rowspan='6'>B
B
B
B
B<br>B</td>
<td rowspan='4'>C
C
C
C</td>
<td rowspan='3'>D
D
D</td>
</tr>
<tr>
<th>2</th>
</tr>
<tr>
<th>3</th>
</tr>
<tr>
<th>4</th>
<td>E</td>
</tr>
<tr>
<th>5</th>
<td>F</td>
</tr>
<tr>
<th>6</th>
<td>G</td>
</tr>
</table>
它按预期出现 . 那么我做错了什么?
2 回答
在包含
E
的行之前添加两个空行首先,要激活6个行,你需要6个非空行,就像http://codepen.io/Toomean/pen/dMeaqd