2017-04-21 75 views
1

由于某种原因,我需要一个表格中的表格。父表格每个都有一个边框,但最后一个是<tr>。孩子的桌子应该没有边界。然而,我无法用CSS去除它们。尝试了几个我能找到的解决方案,但都没有为我工作。奇怪的是CSS的其余遇到,只有边界是持续性...从另一个表格的表格中删除边框

.table_wrapzm { 
 
    border-collapse: collapse; 
 
    font-family: Arial, Helvetica; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    text-align: center; 
 
} 
 

 
.table_wrapzm tr { 
 
    border-bottom: 1px solid #ddd; 
 
} 
 

 
.table_wrapzm .h3 { 
 
    font-size: large; 
 
    font-weight: bold; 
 
    text-align: center; 
 
} 
 

 
.table_wrapzm .bron { 
 
    font-size: small; 
 
    text-align: left; 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:link { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:visited { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm a:hover { 
 
    color: black; 
 
} 
 

 
.table_wrapzm a:active { 
 
    color: #ddd; 
 
} 
 

 
.table_wrapzm td { 
 
    padding-bottom: 3px; 
 
} 
 

 
.table_wrapzm tr:last-child { 
 
    border-bottom: none; 
 
} 
 

 
.table_wrapzm .main { 
 
    padding: 10px 0 10px 0; 
 
} 
 

 

 
/* tabel inside table */ 
 

 
.table_zm { 
 
    border: none !important; 
 
    background: black; 
 
    color: white; 
 
    font-family: Arial, Helvetica; 
 
    text-align: center; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
} 
 

 
.table_zm .h3 { 
 
    font-size: large; 
 
    font-weight: bold; 
 
} 
 

 
.table_zm td { 
 
    padding: 3px; 
 
}
<table class="table_wrapzm"> 
 
    <tr> 
 
    <td class="h3">Title</td> 
 
    </tr> 
 
    <tr> 
 
    <td class="main"> 
 
     <table class="table_zm"> 
 
     <tr> 
 
      <td>Row 1 col 1</td> 
 
      <td>Row 1 col 2</td> 
 
      <td>row 1 col 3</td> 
 
      <td>Row 1 col 4</td> 
 
      <td>row 1 col 5</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Row 2 col 1</td> 
 
      <td>&nbsp;</td> 
 
      <td>row 2 col 3</td> 
 
      <td>&nbsp;</td> 
 
      <td>row 2 col 5</td> 
 
     </tr> 
 
     <tr> 
 
      <td>row 3 col 1</td> 
 
      <td colspan="3">&nbsp;</td> 
 
      <td>Row 3 col 5</td> 
 
     </tr> 
 
     </table> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> source</td> 
 
    </tr> 
 
</table>

+2

将表格边框样式定义为表格单元格,而不是表格本身。 }'。 – skobaljic

+0

我很难看到你正在尝试删除的是什么https://codepen.io/pjabbott/pen/wdWMBB –

+0

@skobaljic工作!我想我已经尝试过了,但它仍然存在于缓存中,因此在刷新了您的解决方案之后! –

回答

0
.table_zm td { border: 0 none; } 

至于建议由@skobaljic做的工作。非常感谢! `.table_zm td {border:0 none;