表只有垂直线可见 [英] table with only vertical lines visible

问题描述

我需要一种方法只显示表格中的垂直线。

我试图添加border-left和border-right，固体#red;，表和单独的td的。但它不会添加边框颜色。

所以，寻找是一个简单的方法来创建这些垂直线。

< table> 比 border 使用 border-collapse
p>

  table {border-collapse：collapse; } tr {border：none; } td {border-right：solid 1px＃f00; border-left：solid 1px＃f00;}  

 表> < tr> < td> a< / td> < td> b< / td> < / tr> < tr> < td> c< / td> < td> d< / td> < / tr>< / table>  

I need a way to show only the vertical lines in a table.

I've tried to add border-left and border-right, both with :1px solid #red;, to both the table and the seperate td's. but it won't add the border color.

So what im looking for is an easy way to create these vertical lines.

解决方案

Use border-collapse on your <table> than border-left and border-right on your <td>.

table { border-collapse: collapse; }
tr { border: none; }
td {
  border-right: solid 1px #f00; 
  border-left: solid 1px #f00;
}

<table>
  <tr>
    <td>a</td>
    <td>b</td>
  </tr>
  <tr>
    <td>c</td>
    <td>d</td>
  </tr>
</table>

这篇关于表只有垂直线可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！