IE6、7下z-index不起效的问题以及层级不能影响select的bug解决方案

近日项目中出现了两个样式问题，耗费了我很多时间，现将其解决方案记录下来，以备今后参考。

IE6、7下z-index不起效

网上搜索了下，主要是由三个方面的原因导致的，具体内容不再赘述，参考如下网站：

http://www.wufangbo.com/ie6-ie7-z-index-bug/

这里主要说一下我遇到的问题，和上面的类型相似，但是有一点点区别，首先展示一下页面：

如图，鼠标移动到“方案说明”四个字的时候，需要显示出一个tip，但是这个tip在IE6下面会被下方的节点遮住，无法显示在最上层：

其实原因很简单，因为页面上所有的分块div都设置为了相同的层级，因此下方的div会遮住上方的小tip，解决方案就是为每一个div设置不同的层级，并且越往下，层级越低：

第一个：

第二个：

以此类推。

IE6下select框总是显示在最上层

这是IE6的一个bug，解决方案主要有三种：

1.不使用select，而采用其他的dom节点来模拟select框

个人比较推荐这种方案，因为select总是会经常用到的，专门制作一个模拟控件，会为以后节省不少时间。

2.使用iframe

iframe给我的感觉就是麻烦携带者，能不用尽量不用。

3.在tip显示之前隐藏select

这属于指标不治本的方法，不过胜在快捷方便。