为什么透明边框颜色看起来比想要的更暗？

Question

示例：http://jsfiddle.net/WaJy7/

我试图为每个<tr>标签添加一个半透明的底部边框，但边框颜色比底部的所有颜色应该更暗，我可以＆＃39;弄清楚原因。

你能解释为什么会发生这种情况以及如何解决这个问题吗？

我对涉及使用非透明色的解决方案不感兴趣。

Answer 1

它似乎是一个边框崩溃的渲染错误。桌子很有趣！

无论如何，我删除了border-collapse：折叠并将边框样式移动到表格单元格本身。现在开心了。

http://jsfiddle.net/WaJy7/2/

table{
    border-spacing: 0; // Equivalent of cell-spacing: 0 on table
    width: 300px;
    margin: 30px;
}

table tbody td{
    border-bottom: 10px solid rgba(0,0,0,0.5);
}

table tbody tr td{
    text-align: center;
    padding: 15px;
}