创建具有三列两行的表与第2列没有边界

问题描述 投票:0回答:1

我需要创建3列和2行的表与第2列没有边界

例如我的代码如下...

 <table border="1" cellpadding="1" cellspacing="1" height="125" width="1037">
 <tbody>        
 <tr>
 <td style="width: 254px">Main Title</td>
 <td style="width: 639px">&nbsp;</td>
 <td>&nbsp;</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>

通过使用下面的代码,我在第二行越来越边框..

因为我需要一个结构,我不需要在第二排的边界。我不能使用合并..。

我唯一需要的是,边界不应该在第二行显示。

但是,结构应保持不变。

我怎样才能做到这一点使用HTML?

html html-table
1个回答
1
投票

使用适用于“表数据”标签而不是边界= 1(这是不建议使用)的风格可能会在这里解决您的问题。您希望如何组织这些样式的应用程序将取决于你想要多少额外的信息添加到表等下面是一个简单的例子,实现你的目标:

对于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">&nbsp;</td>
<td>&nbsp;</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>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

和CSS:

​.border-row td {
    border-style:solid;  
    border-width:1px;
}

.no-border-row td {
    border-style:none; 
}

你并不真的需要指定第二行没有边框,但也许你会喜欢一些不同样式应用到它的未来。

© www.soinside.com 2019 - 2024. All rights reserved.