首先概括一下自己的最近
感觉自己好久没有好好的工作了，一直动荡着
现在终于又可以安定下来工作和学习啦！~
又换了一份新工作，是自己比较感兴趣的公司，是适合自己的职位，公司的氛围神马的也很好，希望自己能够在里面好好的发展下去！~~
现在在公司属于BA部，发现自己要学习的东西还有很多很多噢！~
好了，再来写这个z-index
最近做页面的时候。发现了个问题，就是关于z-index的
以前呢我只晓得z-index就是用来设置层叠顺序的
但是我自己忽略了很重要的一点就是他适用于定位元素（position 属性值为 relative 或 absolute 或 fixed的对象），用来确定定位元素在垂直于显示屏方向（称为Z 轴）上的层叠顺序（stack order）。
我遇到的问题是，左边是一个菜单有两级，当鼠标画上去菜单会横向展开二级菜单；右边是一个图片轮换显示的div，出现的问题就是在ie6，ie7下面，当二级菜单显示的时候，会被旁边的图片轮换的div遮挡住了。我希望的是二级菜单能显示在最上面。
于是我立刻想到了z-index，我给二级菜单设置了了比图片div的z-index大，但是完全没有效果。。。这时候我就百度去了，然后发现是要设置了position的才有用，于是我有设置，但是还是没有效果，于是我仔细学习了一下，发现原来是要对他的父元素设置才有用！
每一个定位元素都归属于一个stacking context。根元素形成 root stacking context，而其他的 stacking context 则由定位元素产生（此定位元素的 z-index 被定义一个非 auto 的 z-index 值），定位子元素会以这个 local stacking context 为参考，用相同的规则来决定层叠顺序。并且 stacking context 和 containing block 之间并没有必然联系。
当 stacking context 一样的时候，就用 z-index 的值来决定怎样显示，如果 z-index 也相同（即 stack level 相同），则按照档中后来者居上的原则（back-to-front ）的顺序来层叠。
当任何一个元素层叠另一个包含在不同 stacking context 元素时，则会以 stacking context 的层叠级别（stack level）来决定显示的先后情况。也就是说，在相同的 stacking context 下才会用 z-index 来决定先后，不同时则由 stacking context 的 z-index 来决定。例如：
定位元素 A（z-index:100）里面有定位元素 A1（z-index:300），而定位元素 B 和元素 A 兄弟关系（z-index:200）。你会发现无论 A1 的 z-index 是多大，也会被 z-index 是 200 的 B 所覆盖，因为 A 的 z-index 只有 100。
最后我将左侧边菜单大容器的position设置为relative，图片轮换div 的poseition也设置为了relative，菜单的z-index设置为99，图片轮换的div的z-index设置为9，解决了这个问题！~
