我发现同时应用css渐变滤镜时，表格单元格上的css边框丢失了。好像渐变效果覆盖了边框。
是浏览器的错误还是我在这里遗漏了什么？
样式定义如下：
.c7 {
color: #000000;
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#c0c0c0',EndColorStr='#f0f0f0');
border: #000000 1px solid;
width: 100px;
height: 30px;
}
[更新] 您可以应用不透明度过滤器并将其从 100 减少到 1，您可以看到边框是如何逐渐出现的。它证实了我的猜测，渐变效果显示在边框上。
【问题讨论】：
我找到了解决方法，但您可能不喜欢它...
如果您在 IE 中以quirks mode 呈现边框，则边框呈现正常，只有在您使用兼容模式时才会被遮挡。在 IE8 中比较这两个页面：
单击兼容性视图按钮也有效，但我尝试使用 compatibility mode meta tags 获得相同结果的尝试没有成功。我尝试使用box-sizing，但也没有成功。我得出结论，让它按你想要的方式工作的唯一方法是强制 IE 进入 quirks 模式，但这可能会给布局带来很多其他问题，你最好添加一个包装元素来附加你的渐变背景。
【讨论】：
应用这个也可以：
position: relative;
z-index: -1;
【讨论】：
z-index: -1; 让它在 IE8 中工作（没有它在其他地方也很好）。
使用 DIV 来包含每个单元格中的内容。将渐变应用到 DIV 并将边框放在单元格上。渐变会限制在DIV，不会覆盖边框。
【讨论】：
使用位置：相对！重要；
它的工作正常......
【讨论】：
在 td 上：
/* enough for IE9 */
background-origin: padding-box;
background-clip: padding-box;
/* for IE8 */
position: relative;
为我工作。
您也可能想尝试使用边框折叠，因为此错误在
之间的行为不同 border-collapse: separate
和
border-collapse: collapse
【讨论】：
在尝试了很多修复后，我得出的结论是，它根本不值得尝试使用过滤器 CSS。 quote from @mdo 是 Twitter 引导 css 的幕后推手：
过滤器在 IE 中是危险的业务，尤其是 7 和 8。我宁愿不包括那些，因为对于过度使用它们的人来说，这将是巨大的性能损失。
将 css 应用于 td 元素时遇到的问题：
position: relative 仅适用于 IE9，不适用于 IE8z-index: -1 不适用于 td 元素【讨论】：
我尝试了所有这些解决方案，但均未成功。因此，我将渐变放在 tr 中，然后决定使用 ::before 伪元素并在其上设置边框样式。但是，我什至没有为伪元素添加边框。以下就足够了。
table thead {
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e9e9d9',GradientType=0 );
-ms-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e9e9d9',GradientType=0 );
}
table th {
background: none;
border-right: 1px solid #a5a694;
background-clip: padding-box;
position: relative!important;
z-index: 100;
}
table th:before {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
content: '';
}
但如果这不起作用，您还可以按照我最初的计划为伪类添加边框：
table th:before {
border-right: 1px solid #000000;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
content: '';
z-index: 1000;
}
伪类很棒，我一直在使用它们，而且它们对浏览器的支持非常广泛，甚至在 IE8 中也是如此。
【讨论】：