内嵌样式的tr border-bottom问题

Question

我试图将border-bottom添加到<tr>表的元素，如下所示，但它不起作用

<table>
<tr style="border-bottom: 1px solid black !important;">

当我添加样式<td>但不启用样式时，它正在工作<tr>。你能让我知道如何解决吗？

谢谢

Answer 1

你可以不适用于边框tr元素，你需要申请一个边界td，或者你需要使用border-collapse你的table元素

演示 （适用border-bottom于td）

演示2 （如果使用border-bottom，tr则适用于border-collapse）

table {
    width: 100%;
    border-collapse: collapse; 
}

table tr { /* Use table tr td if not using border-collapse property */
    border-bottom: 1px solid #eee;
}

注意：避免使用内联样式，在某些时候您将很难更改它们，此外，!important除非需要，否则避免使用，请考虑使用更具体的选择器