2012-12-05 47 views
0

没有边界,我需要在第二列创建一个表3列和2行与第2列

创建具有3列和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?

回答

1

使用应用于'table data'标签而不是border = 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; 
} 

你并不真的需要指定第二行不具有边界,但也许你可能喜欢应用一些不同的风格在将来。

+0

我在这里有一个疑问..你添加了类为tr和为td写..会这样工作..因为在我的情况下它不工作。 – Fero

+0

你想要看起来像这样的东西吧? [链接](http://jsfiddle.net/5PnJ7/)它似乎按预期对我工作? – Chris

相关问题