css - border-bottom 没有出现在所有的 TD 上，只出现在最后一个 TR 的 TD 上

Question

我在这里有一个表格，我正在尝试对其应用一些 CSS 规则。我有一个 CSS 规则来将边框底部和边框顶部分别设置为红色和绿色。由于某种原因，border-bottom 并未出现在所有 TD 上，而仅出现在最后一个 TR 的 TD 上。任何理由。

    table{
        border-collapse:collapse;
    }
    table td{
        border-top:solid 4px green;
        border-bottom:solid 2px red;
    }
<table width="500px">
        <tr>
            <td>Computers</td>
            <td>£900</td>
        </tr>
        <tr>
            <td>Laptops</td>
            <td>£600</td>
        </tr>
        <tr>
            <td>Keyboards</td>
            <td>£20</td>
        </tr>
        <tr>
            <td>Hard Drives</td>
            <td>£80</td>
        </tr>
    </table>

Answer 1

边界重叠，绿色在红色之上。纠正这个集合border-collapse: separate;而不是border-collapse: collapse;