Question

我正在尝试将border-bottom添加到表的<tr>元素，如下所示，但它无法正常工作

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

当我将样式添加到<td>而不是<tr>时，它正在工作。你能告诉我如何解决它吗？

由于

Answer 1

您无法在tr元素上应用边框，您需要在td上应用边框，或者需要对table元素使用border-collapse

Demo （将border-bottom应用于td）

Demo 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，考虑使用更具体的选择器

在内联样式的tr-border-bottom上发出问题

1 个答案: