Html 如何使一个 <td> 跨越两列表中的两列?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17605976/
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
How to make one <td> span both columns in a two column table?
提问by Ben Ben-Hamo
How can I create a table like the above example in HTML and CSS. I've tried the following:
如何在 HTML 和 CSS 中创建类似于上述示例的表格。我尝试了以下方法:
<table>
<tr>
<td style="width:50%">TEXT</td>
<td style="width:50%">TEXT</td>
</tr>
<tr>
<td style="width:100%">TEXT</td>
</tr>
but it won't work. Can anyone help?
但它不会工作。任何人都可以帮忙吗?
回答by Aldi Unanto
You should use colspan
for your second row. Like this :
你应该colspan
用于你的第二行。像这样 :
<table>
<tr>
<td style="width:50%">TEXT</td>
<td style="width:50%">TEXT</td>
</tr>
<tr>
<td colspan="2" style="width:100%">TEXT</td>
</tr>
...
</table>
For learn -> HTML Colspan
学习 -> HTML Colspan
回答by smilebomb
<td>
s have a colspan
attributethat determine how many columns it should span over. You example has 2 columns to span, so your cleaned up code would look like this:
<td>
s 有一个colspan
属性来确定它应该跨越多少列。您的示例有 2 列要跨越,因此您清理后的代码如下所示:
<table>
<tr>
<td width="50%"></td>
<td width="50%"></td>
</tr>
<tr>
<td width="50%"></td>
<td width="50%"></td>
</tr>
<tr>
<!-- The important part is here -->
<td colspan="2">This will have 100% width by default</td>
</tr>
<tr>
<td width="50%"></td>
<td width="50%"></td>
</tr>
<tr>
<td width="50%"></td>
<td width="50%"></td>
</tr>
</table>
回答by FBaez51
<table border="1">
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
</tr>
<tr>
<td colspan="2">Cell 3 (Two columns)</td>
</tr>
</table>
colspan will help you. Link to more info.
colspan 会帮助你。链接到更多信息。