在table中实现hover显示窗口效果时，遇到层级问题。td相对定位，内部div绝对定位在Chrome下工作正常，但在IE7中层级问题显现。解决方法包括：1. 给td添加递减层级；2. 在弹窗div外加一个相对定位的div。后者为更优解，避免了过多层级导致的问题。问题根源在于不同浏览器对td和div的position:relative支持差异。
先来看看问题是怎样的：
问题描述：就是一个table，我们想实现的效果是hover到比如标题上面，展示一个窗口的姑且，上面展示一些详细的内容。这样的效果，虽然用div列表也可以实现，但是table总有table的优势，我们这里就讲table。
这时候就开动了，很多人的想法，很简单嘛，首先td相对定位，然后里面加个div就是外面那个窗口，绝对定位，完美解决。我只能说，太年轻了我们...
上面的思路是对的，但是呢，问题出现了......
我们先不说上面怎么解决，先来一步步分析问题。首先什么都不做，给td相对定位 position: relative; 给矩形框绝对定位position: absolute;
table美美的样子（姑且美吧...）
然后我div加上了... chrome下面
IE7：
线条都能
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
