更改tr和td的边框颜色

Question

我正在尝试使表格的边框看起来像附加的图片但是它没有实现边框颜色或任何东西。这可能与Bootstrap＆＃39;表格有关。类。

这是我的代码：
HTML：

<table class="table">
        <tbody>
            <tr>
                <td>
                    <span class="glyphicon glyphicon-calendar" id="left-info" > 17 SEPTEMBER</span>
                </td>
             </tr>
        </tbody>
    </table>

的CSS：

table{
padding: 10px !important;
background-color: #575757 !important;
}

tr{
background-color: #575757;
border-top: 10px!important;
border-top-color: #383D3D !important;

}

td{
border-left: 3px !important;
border-left-color: #383D3D !important;
}

Answer 1

好吧，我没有看到附加任何图像。但我希望这是你的搜索！ 尝试为每个TR和TD分别提供ID，然后在CSS中定义它们的颜色！ 如下例所示，

<table>

<tr id="one">
<td><td><td></td>
</tr>

<tr id="two">
<td><td><td></td><td></td>
</tr>

</table>

#one td{
border: 1px solid #ff0000;;  
}

Answer 2

table{
border-collapse: collapse;
background-color: red;
}
tr{
background-color: #575757;
border-top: 10px solid #383D3D !important;
}
td{
    padding:10px;
border-left: 3px solid green !important;
}

<table class="table">
        <tbody>
            <tr>
                <td>
                    <span class="glyphicon glyphicon-calendar" id="left-info" > 17 SEPTEMBER</span>
                </td>
             </tr>
        </tbody>
    </table>

Answer 3

您尚未在css中将border-type指定为solid。如果没有类型，则边框样式永远不会正常工作。

CSS：

table{
 padding: 10px !important;
 background-color: #575757 !important;
}

tr{
 background-color: #575757;
 border-top: solid 10px!important;
 border-top-color: #383D3D !important;
}

td{
 border-left: solid 3px !important;
 border-left-color: #383D3D !important;
}

这是一个有效的DEMO。

Answer 4

我认为此代码适合您：

<table class="table">
    <tbody>
        <tr>

            <td id="halfborder">
                <span class="glyphicon glyphicon-calendar" id="left-info1" > 17 SEPTEMBER</span>
            </td>
            <td>
                <span class="glyphicon glyphicon-calendar" id="left-info2" > 17 SEPTEMBER</span>
            </td>

         </tr>
    </tbody>
</table>

和风格：

#left-info1 {
    border-right:1px solid #999;
}
td {     padding:0px 10px;    }

.table {
    background-color:#333;
    padding:10px 0;
}