在表格TR的TH内部添加边框顶部

Question

我在tr的内部插入边框，但它没有应用边框。 我的代码

<tr class="shipping">
<th>Shipping 2</th>
<td data-title="Shipping 2">
                <p>There are no shipping methods available. Please check your address or contact us if you need any help.</p>

                <p class="woocommerce-shipping-contents"><small>Military Grade Paracord Kit ×1</small></p>      
        </td>

和css是

tr {
    border-top: 9px solid red;
   }

Answer 1

如果您想设置tr元素的边框，则应将表格的border-collapse设置为collapse：

table {
  border-collapse: collapse
}
tr {
    border-top: 9px solid red;
}

<table>
  <tr class="shipping">
    <th>Shipping 2</th>
    <td data-title="Shipping 2">
      <p>There are no shipping methods available. Please check your address or contact us if you need any help.</p>
      <p class="woocommerce-shipping-contents"><small>Military Grade Paracord Kit ×1</small></p>      
    </td>
  </tr>
</table>

Answer 2

你可以试试这个：

tr > th {
    border-top: 9px solid red;
}