2

我有一个带有 css 的简单表格。当我在中间行添加底部边框时，下一行有一个非常奇怪的边框。它只发生在 chrome 中，我不知道为什么。

我应该说我使用javascript将底部边框应用于中间行（因为我事先不知道表格的大小）。我试图在没有 javascript 的情况下申请，它没有奇怪的问题。

这是表格的示例，请注意中间的边框： http ://ri-cloud.appspot.com/super_tacticko?create

这是我用来创建中间线的 javascipt：

// add the middle line
var half = height / 2; // it has to be zugi anyway
var $middle = $('tr').slice(half-1, half);
$middle.find('td').addClass('middle-td');
4

3 回答 3

3

如果调整窗口大小可以解决问题（就像在我的情况下一样），它很可能是一个渲染错误...... Chrome 有一些不时出现的问题，主要是因为它试图比其他所有东西都快通过偷工减料（imo）。

解决错误的唯一方法是不断尝试不同的方法，直到找到不会触发问题的方法，或者尝试在创建表/正文后以编程方式调整其大小，然后再次将其放回正确的大小——这可能会迫使 Chrome 正确重绘……并且应该发生得足够快，以至于用户不会注意到。第三种方法可能是完全用 JavaScript 构建表格，一旦正确形成，将其嵌入到页面中。

CSS 方法可能起作用的原因是因为它将在渲染过程中与 JavaScript 样式修改的不同点使用 Chrome 的渲染方法。

基本上，我已经看到 Chrome 做了一些非常奇怪的事情。我过去用来解决奇怪的 Chrome 问题的技巧是：

  1. 在尺寸计算中使用小数——即30.1px代替30px
  2. 不将不透明度设置为完全 - 即0.99而不是1.0
  3. .设置 cookie 时不要使用以 a 为前缀的 IP 地址
  4. 用于overflow: hidden修复某些情况下的奇怪渲染。


哦，只是为了记录，我正在通过 Chrome v25.0.1364.97 在 Windows 7 上查看

于 2013-03-05T09:00:37.823 回答
1

我在 Windows 10 上的 Chrome 中遇到了类似的问题。此问题的原因是 Chrome 无法正常使用 Windows 文本大小设置功能（恕我直言，在 Win OS 中更改 DPI）。当我从 125% 文本大小切换到 100% 文本大小时，Chrome 正在正确呈现我的 HTML 表格。据我一直在测试，其他浏览器都可以使用此功能。

于 2021-06-26T06:49:42.877 回答
0

最后我对这个问题做了一个快速修复，如下所示：

table {
  tr td {
    border-color: transparent !important;
    outline: 1px solid #666;
  }
}

它不是防弹的，边框的大小是 2px，但总比没有好。

于 2021-06-26T07:30:35.330 回答