4

我的表格在 IE8 中引起了问题。我无法让表格标题中的分隔边框出现在渐变上方（除了在一个位置，您可以在下图中看到）。边框在所有其他浏览器中都很好，甚至在 IE8 兼容模式下也是如此。有想法该怎么解决这个吗？ 这里是一个测试站点，供大家查看应用代码。

IE8和IE8兼容模式下表格标题边框对比

这是表头的 CSS，但您可以在此处查看整个 CSS 文件：

.gridview th {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MCUiIHkxPSIxMDAlIiB4Mj0iNTAlIiB5Mj0iLTEuNDIxMDg1NDcxNTIwMmUtMTQlIj4KPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNTM4MyIgc3RvcC1vcGFjaXR5PSIxIi8+CjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzhmZDlmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgIDwvbGluZWFyR3JhZGllbnQ+Cgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0idXJsKCNoYXQwKSIgLz4KPC9zdmc+);
    background-image: -webkit-linear-gradient(90deg, #005383 0%, #90d9ff 100%);
    background-image: -moz-linear-gradient(90deg, #005383 0%, #90d9ff 100%);
    background-image: -o-linear-gradient(90deg, #005383 0%, #90d9ff 100%);
    background-image: -ms-linear-gradient(90deg, #005383 0%, #90d9ff 100%);
    background-image: linear-gradient(90deg, #005383 0%, #90d9ff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#90d9ff, endColorstr=#005383);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#90d9ff, endColorstr=#005383)";
    background-color: #005383;
    line-height: 18px;
    vertical-align: top;
    padding: 4px;
    font-weight: bold;
    text-align: center;
    border-left: 1px solid #005580;
    color: #fff;
}
4

4 回答 4

1

我尝试解决您的问题，但无法解决。我看到这发生在 IE8 和 IE9 文档和浏览器模式下。然而，不在 IE 7 中。但是当只使用

 background-image: url(data:image/.......);

边框在 IE9 中工作......只剩下 IE 8 来解决。您可以使用 IE7 和 IE9 特定的条件注释a 来使用上面的代码（对于 IE9）和 

filter: progid:DXImageTransform.Microsoft

对于 IE7。关于IE8中的问题，这里有一个类似的帖子：

在 IE8 中应用 css 渐变过滤器时表格单元格失去边框

于 2012-08-21T19:20:23.587 回答
0

我找到了一个修复程序，但我对它不是很满意，因为它不再是有效的 HTML……但这似乎解决了旧版本 IE 中的问题：

<!--[if !IE]> -->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- <![endif]-->

我把这个给我的老板看，他不同意，所以我还在寻找解决方案！！！

于 2012-08-21T20:00:41.753 回答
0

将此添加到我的 css 对我来说是一个解决方案：

table {
   border-collapse: separate;
}
于 2012-09-18T11:32:24.630 回答
0

我搜索过的解决方案都没有奏效。对于 IE8，背景颜色仅适用于正文表行。每当我为标题行或标题列使用背景颜色时，边框就会消失。

对我有用的是为表格本身定义背景颜色。标题没有背景颜色。每个正文表行都需要定义背景颜色以覆盖表上定义的颜色（如果需要）。

于 2014-01-10T16:13:58.190 回答