html - 更改表格单元格边框的颜色

Question

我希望能够更改任何表格单元格边框的颜色。 我决定不使用 border-left、border-right 等，因为它不可能做到像素完美。不同的浏览器以不同的方式呈现它。特别是在边界交叉区域。 我想出了这个方法，但它在 IE 中并没有像我预期的那样工作:

HTML:

<table>
    <tr>
        <td>
            line 1
            <div class="left-border"></div>
        </td>
        <td>
            line 1<br>
            line 2
        </td>
    <tr>
</table>

CSS:

table {
    border-collapse: collapse;
}

table, th, td {
   border: 1px solid #ccc;
}

tr {
    vertical-align: top;
}

td {
    position: relative;
    padding: 5px;
}

.left-border {
    position: absolute;
    top: -1px;
    bottom: -1px;
    left: -1px;
    width: 1px;
    background-color: #000;
}

JSFIDDLE:http://jsfiddle.net/dv1oqopL/5/

Answer 1

嗯，IE 一如既往是一个 B***h，它只是根据它自己的内容计算 td 的高度，所以我没有给你彻底的解决办法，但一个可能解决你问题的 hack 是添加

border-left:1px solid #000;

在那个 td 上，这将填充您的 div 下方的边框，并且看起来像所有浏览器的一部分。