Html 是否可以通过多个表格在页面中心创建统一的垂直边框?

Html 是否可以通过多个表格在页面中心创建统一的垂直边框?,html,css,Html,Css,我有一个HTML页面,重复下表多次。目前,两个单元格平均共享一半页面。我想在它们之间放置一个沿页面中心垂直向下的边框。我尝试在左单元格的单元格上放置右边框,但由于单元格之间的间距以及单独表格之间的间距,因此无法生成统一的边框 有人对我如何在页面中心创建统一的边框有什么建议吗 <table class="ex2" width="100%"> <tr> <td width=50%><a href="www.test.com"<p style="f

我有一个HTML页面,重复下表多次。目前,两个单元格平均共享一半页面。我想在它们之间放置一个沿页面中心垂直向下的边框。我尝试在左单元格的单元格上放置右边框,但由于单元格之间的间距以及单独表格之间的间距,因此无法生成统一的边框

有人对我如何在页面中心创建统一的边框有什么建议吗

<table class="ex2" width="100%">  
<tr>
 <td width=50%><a href="www.test.com"<p style="font-family:verdana">Test Title - Left</p></a></td>
<td width=50%><a href="www.test2.com"><p style="font-family:verdana;color:red">Test Title - Right</p></a></td>   
</tr>    
<tr>    
  <td width=50%><p style="font-family:verdana;color:grey">Test Body - Left</p></td>    
  <td width=50%><p style="font-family:verdana;color:grey">Test Body - Right</p></td>
</tr></table>

测试车身-左侧

测试车身-右侧


好的,我想出了一个简单但可能简化的解决方案(如果您想使用js/jquery/etc)

也许有更好的方法来做你想做的事情(即不使用桌子),但你可以试试看哈哈

<style>

.addborder {
border-right: 1px solid #666;
}

.addspace {
padding-left: 20px;
}

.ex2 { padding: 0px; margin: 0px; }

</style>

addborder先生{
右边框:1px实心#666;
}
.addspace{
左侧填充:20px;
}
.ex2{填充:0px;边距:0px;}
对于css和

<table width="100%" border="0" cellpadding="0" cellspacing="0" class="ex2">  
<tr>
 <td class="addborder" width=50%><a href="www.test.com"<p style="font-family:verdana">Test Title - Left</p></a></td>
<td class="addspace" width=50%><a href="www.test2.com"><p style="font-family:verdana;color:red">Test Title - Right</p></a></td>   
</tr>    
<tr>    
  <td class="addborder" width=50%><p style="font-family:verdana;color:grey">Test Body - Left</p></td>    
  <td class="addspace" width=50%><p style="font-family:verdana;color:grey">Test Body - Right</p></td>
</tr></table>

测试车身-左侧

测试车身-右侧

对于您的表格html;)


希望这有帮助

要删除单元格之间的额外空间,可以使用:

<style type="text/css">
table.ex2{
    border-collapse:    collapse;
}
</style>

表2.ex2{
边界塌陷:塌陷;
}

您的表中没有提到css。如果表格上没有上/下页边距,则在表格上使用
边框折叠:折叠
,请参阅


如果表上有上/下边距,并且不关心IE7或IE7以下的内容,那么可以使用一个包装元素样式,通过
:在
伪元素之前,请参阅

记住不要重复ID;如果您需要两次使用同一ID,请改用类:),如果每个单元格都有边框对您来说很重要,那么您可以在每个单元格中插入
测试标题-左/右
,并设置边距、边框等。@ChristianVarga修复:),我当时很匆忙,差点错过了我的课程(双关语;))我试了一下,虽然它产生了一条统一的线条,但它也要求我去掉桌子之间的间距。我本可以接受这一点,但Scott的解决方案允许我在不删除额外间距的情况下实现我的目标。您可以简单地在样式中添加.ex2 td{padding:10px;}来定制您自己的间距,但是如果您不需要额外的定制,Scott的似乎更接近您的原始点;)我实际上在寻找一种解决方案,它不需要我删除单元格之间的额外间距。很好,你的第二种解决方案正是我想要的!非常感谢!