z-index不生效的原因和解決方法

運行下面代碼看看

<div style="z-index:4;width:560px;background-color:Aqua; ">不生效 <a href="http://jihua.cnblogs.com">jihua.cnblogs.com</a></div>
<div style="z-index:3;width:360px;background-color:Fuchsia; position:absolute;">有效 <a href="http://jihua.cnblogs.com">jihua.cnblogs.com</a></div>
<div style="width:760px;background-color:Silver;">底部</div>

 

 效果如下

不生效 jihua.cnblogs.com

有效 jihua.cnblogs.com

底部 jihua.cnblogs.com

 

 Z-index 僅能在定位元素上生效，所以給div的style加上z-index:3的同時，要記得加上position:absolute;或者position:fixed;，才能生效。