Html 创建一个三列两行的表格,第二列没有边框
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13721649/
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
Creating a table with three columns and two rows with no border on 2nd column
提问by Fero
I would need to create a table with 3 columns and 2 rows with no border on 2nd column
我需要创建一个有 3 列和 2 行的表格,第二列没有边框
For example my code is below...
例如我的代码如下...
<table border="1" cellpadding="1" cellspacing="1" height="125" width="1037">
<tbody>
<tr>
<td style="width: 254px">Main Title</td>
<td style="width: 639px"> </td>
<td> </td>
</tr>
<tr>
<td style="width: 254px">Lots of Contents Column I</td>
<td style="width: 639px">Lots of Contents Column II</td>
<td>Lots of Contents Column III</td>
</tr>
</tbody>
</table>
By using the below code I am getting borders on the second row..
通过使用下面的代码,我得到了第二行的边框..
I don't need borders on the second row.. I can't use merge.. Because I need that structure.
我不需要第二行的边框.. 我不能使用合并.. 因为我需要那个结构。
The only thing what I need is that borders should not be displayed in second row.
我唯一需要的是边框不应显示在第二行。
But the structure should be remain same.
但结构应该保持不变。
How can I do that using HTML?
我怎样才能使用 HTML 做到这一点?
回答by Chris
Using styles applied to the 'table data' tags instead of border=1 (which is deprecated) might solve your problem here. How you wish to organize the application of these styles will vary depending on how much extra information you want to add to the table, etc. Here is a simple example that accomplishes your goal:
使用应用于“表格数据”标签的样式而不是 border=1(已弃用)可能会在这里解决您的问题。您希望如何组织这些样式的应用程序将根据您想要添加到表格中的额外信息的数量等而有所不同。这是一个可以实现您的目标的简单示例:
For the html, added a class to each tr (please also note cellpadding/cellspacing is also deprecated):
对于 html,为每个 tr 添加一个类(另请注意 cellpadding/cellspacing 也已弃用):
<table cellpadding="1" cellspacing="1" height="125" width="1037">
<tbody>
<tr class='border-row'>
<td style="width: 254px">Main Title</td>
<td style="width: 639px"> </td>
<td> </td>
</tr>
<tr class = 'no-border-row'>
<td style="width: 254px">Lots of Contents Column I</td>
<td style="width: 639px">Lots of Contents Column II</td>
<td>Lots of Contents Column III</td>
</tr>
</tbody>
</table>????????????????????????????????
And the css:
和CSS:
?.border-row td {
border-style:solid;
border-width:1px;
}
.no-border-row td {
border-style:none;
}
?You don't really need to specify that the second row doesn't have a border, but maybe you might like to apply some different styles to it in the future.
?你真的不需要指定第二行没有边框,但也许你将来可能想对其应用一些不同的样式。