html – 丢失：在Chrome之间悬停状态

概述我试图通过在用户将鼠标悬停在其上时更改行的背景颜色来实现简单的表行悬停效果,这很简单： tr:hover { background: red;} 但是我注意到了chrome中的一个错误,其中一行中的单元格之间有一个小空间,我丢失了：hover和< tr>即使我的鼠标仍然在行上,当您移动它时,也可以打开/关闭该样式. 我尝试过border-collapse：collapse,cellspa 我试图通过在用户将鼠标悬停在其上时更改行的背景颜色来实现简单的表行悬停效果,这很简单：

tr:hover {    background: red;}

但是我注意到了Chrome中的一个错误,其中一行中的单元格之间有一个小空间,我丢失了：hover和< tr>即使我的鼠标仍然在行上,当您移动它时,也可以打开/关闭该样式.

我尝试过border-collapse：collapse,cellspacing =“0”但是看不清楚为什么我会失去< tr>悬停在细胞之间,它只发生在细胞的任何一侧,而不是在细胞的上方/下方.它在firefox中按预期工作.

这是一个JSFiddle,在Chrome中,尝试慢慢将鼠标从“第一个”移动到“第二个”,你会看到它们之间有一个非常薄的点,其中< tr>失去它的悬停背景.

我已将此报告为Chromium BUG here.

解决方法 我不知道为什么会这样,但是在< td>上设置定位.元素似乎在Chrome中修复此问题.

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

jsFiddle example.

@H_502_38@ 总结

以上是内存溢出为你收集整理的html – 丢失：在Chrome之间悬停状态全部内容，希望文章能够帮你解决html – 丢失：在Chrome之间悬停状态所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。