1

这个怎么做？我想在表格行的顶部和底部边框上使用不同的颜色。如果我使用 Chrome 会正确呈现它display: block，但我不知道这是否是正确的做法。但是，我希望它在 IE8 中工作，但我不知道如何。

我准备了一个适用于 Chrome 的小提琴：http: //jsfiddle.net/s6LQ7/

4

2 回答 2

9

这适用于 Firefox 和 IE8：

table {
    width: 100%;
    border-collapse: separate; /* Not really necessary unless you use normalize.js */
    border-spacing: 0px; /* take out spaces between cells */
}

tr {
    background-color: #ccc;
}

td {
    width: 50%;
    border-top: 1px solid #f00; 
    border-bottom: 1px solid #0f0; /* move spacing to the cell */
}

以上使用标准的 HTML 显示系统，因此它可以在 IE8 上运行。我有：

  • 设置border-collapse为separate，防止表格折叠边框，因此绘制每个边框
  • 添加border-spacing了设置以0px删除单元格之间的间距
  • 删除了display指令，允许表格显示为表格
  • 将指令移动border到单元格，而不是行。

http://jsfiddle.net/s6LQ7/1/

于 2013-01-28T14:07:29.717 回答
-1

您是否尝试将边框放在单元格而不是行上？另外，除非您使用类作为选择器，否则大多数 css 规则将不适用于表格单元格。

于 2013-01-28T14:01:39.223 回答