HTML 表格行 - 如何使唯一的单元格具有 100% 的宽度?(附截图说明)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7995508/
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
HTML Table Rows - How to make a unique cell have 100% width? (with screenshot explanation)
提问by Hyman
Here's my problem: I have an HTML table that looks like this:
这是我的问题:我有一个 HTML 表格,如下所示:
What I want is for there to be an additional table row underneath it, except this row spans the full width of the table - but with just one cell. I quickly mocked up an example:
我想要的是在它下面有一个额外的表格行,除了这一行跨越表格的整个宽度 - 但只有一个单元格。我很快模拟了一个例子:
As you can see I added another Table Row below it with a single <td>
cell inside containing the text. However I want this cell to span 100% of the width of the entire table - it shouldn't resize the width of the 'Name' column.
如您所见,我在其下方添加了另一个表格行,其中包含一个<td>
包含文本的单元格。但是我希望这个单元格跨越整个表格宽度的 100% - 它不应该调整“名称”列的宽度。
Is such a thing possible? I am happy to use jQuery or Javascript if needs be - also, this doesn't need to work in IE as every user is using Chrome (although that would be a perk).
这样的事情可能吗?如果需要,我很乐意使用 jQuery 或 Javascript - 而且,这不需要在 IE 中工作,因为每个用户都在使用 Chrome(尽管这将是一个特权)。
回答by cHao
In your case, you'd do something like
在你的情况下,你会做类似的事情
<tr>
<td colspan="5">This text should be as long as the entire table's width...</td>
</tr>
The colspan
attribute says how many columns the cell should take up. It should work in all browsers that support tables, as it's standard HTML.
该colspan
属性表示单元格应该占据多少列。它应该适用于所有支持表格的浏览器,因为它是标准的 HTML。
In JavaScript, you'd set the colSpan
property of the cell, or call .setAttribute("colspan", the_number_of_columns)
on it. Either should work. But unless you're generating the cell dynamically, you should just include the colspan
attribute in your HTML.
在 JavaScript 中,您可以设置colSpan
单元格的属性,或者调用.setAttribute("colspan", the_number_of_columns)
它。要么应该工作。但是除非您动态生成单元格,否则您应该只colspan
在 HTML 中包含该属性。
回答by harriyott
For one cell to span all 5 columns,
对于一个跨越所有 5 列的单元格,
<td colspan="5">Lorem Ipsum</td>