HTML 表格可以在行上有可变数量的单元格吗?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3484768/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can HTML table have variable number of cells on rows?
提问by randomguy
Or should the total amount of cells equal to columns * rows
?
或者细胞总数应该等于columns * rows
?
A table with different amount of cells on different rows seems to pass the W3 Validator.
不同行上具有不同数量单元格的表格似乎通过了 W3 验证器。
回答by 2ndkauboy
That does not violate the definition. But you should use the colspanattribute to expand the column to the whole row:
这并不违反定义。但是您应该使用colspan属性将列扩展到整行:
<table>
<tr>
<td>Row with</td>
<td>2 cols</td>
</tr>
<tr>
<td colspan="2">Row with only one col</td>
</tr>
</table>
That will also help if you have borders around the cells.
如果您在单元格周围有边框,这也将有所帮助。
You can even have tables with a column that expands to two rows:
您甚至可以拥有一列扩展为两行的表格:
<table>
<tr>
<td rowspan="2">First column in row 1 and row 2</td>
<td>Second column in row 1</td>
</tr>
<tr>
<td>second column in row 2</td>
</tr>
</table>
回答by meder omuraliev
You can use colspan
, but the sum including the colspan
value(s) should be equal for the table to render properly.
您可以使用colspan
,但包括colspan
值的总和应该相等,表格才能正确呈现。
<table>
<tr>
<td colspan="2">blah</td>
</tr>
<tr>
<td>blah</td>
<td>boo</td>
</tr>
</table>
The first row has one cell but it spans 2 cells because of the colspan
, the second row has two cells and this is perfectly valid.
第一行有一个单元格,但由于 ,它跨越了 2 个单元格colspan
,第二行有两个单元格,这是完全有效的。
回答by Bang Dao
Yes, it can.In table > tr > td
, td
is contain the content. Td
reference here: http://www.htmlcodetutorial.com/tables/_TD.html. In that reference, you can see that TD has 2 attributes that is: colspanand rowspan. By using those 2 attributes, a table can have different amount of cells on different rows.
Demo:
是的,它可以。在table > tr > td
,td
是包含内容。Td
参考这里:http: //www.htmlcodetutorial.com/tables/_TD.html。在该参考中,您可以看到 TD 有 2 个属性:colspan和rowspan。通过使用这 2 个属性,表格可以在不同的行上具有不同数量的单元格。
演示:
<table border="1">
<tr>
<td>a</td>
<td>b</td>
</tr>
<tr>
<td colspan="2">c</td>
</tr>
</table>
And
和
<table border="1">
<tr>
<td rowspan="2">a</td>
<td>b</td>
</tr>
<tr>
<td>c</td>
</tr>
</table>
回答by dthorpe
Yes, you can make an HTML table and leave out <td>
elements on some of the rows, but this is considered bad form because you can't be sure how the HTML renderer (browser) will handle this situation. It may be rendered slightly differently by different browsers.
是的,您可以制作一个 HTML 表格并<td>
在某些行上省略元素,但这被认为是不好的形式,因为您无法确定 HTML 呈现器(浏览器)将如何处理这种情况。不同的浏览器可能会以稍微不同的方式呈现它。
The recommended way to define a table with a varying number of cells displayed per row is to use colspan
to join two or more adjacent cells into one. This will keep the right-most cells lined up with their correct columns and eliminates any ambiguity about what you want the HTML renderer to do.
定义每行显示不同数量单元格的表格的推荐方法是使用colspan
将两个或多个相邻单元格合并为一个。这将使最右侧的单元格与其正确的列对齐,并消除您希望 HTML 渲染器执行的操作的任何歧义。
回答by binhhoang18
You used:
你用过:
<table>
<thead>
<th>Column one</th>
<th>Column two</th>
<th>Column three</th>
</thead>
<tbody>
<tr>
<td rowspan="2">A large cell</td>
<td>Another small cell0</td>
<td>Another small cell0</td>
</tr>
<tr>
<td>Another small cell1</td>
<td>Another small cell1</td>
</tr>
</tbody>