我有一个 2×2 的图像网格，使用 CSS 中的 float 属性排列。
当我将鼠标悬停在每个图像上时，我想通过将其不透明度从 0 切换到 1 来在悬停时在每个图像上显示一个小覆盖。当我将图像悬停在顶行时，我的代码效果很好。
但是，当我将鼠标悬停在下行图像上时，激活的叠加层仍然是顶行的图像。
我认为这是定位问题。
我的代码在这里:http://jsfiddle.net/zZXZX/27/
PS:请不要介意设计中的小错误。
最佳答案
您以绝对方式定位叠加层，而没有指定相对父级。
http://jsfiddle.net/tomprogramming/zZXZX/28/
position:absolute 使用相对于其第一个不是 position:static 的父级的偏移量定位叠加层，或者如果没有找到，则为文档根。
关于html - div-hover 上的叠加位置，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14125193/