HTML里两个DIV颜色重叠问题

[很明显我是猪头]

[size=24px]需要红色DIV显示时，背景变暗，于是想到使用两个DIV，但是貌似background-color有冲突，红色DIV也变暗了，设置成block也不行，有什么解决办法吗？

[天际的海浪]

两个div不要嵌套，红色div的z-index设置高一些

[很明显我是猪头]

引用 1 楼 jslang 的回复:

两个div不要嵌套，红色div的z-index设置高一些

正解，的确是z-index的问题，一开始对z-index不是很理解，把zz的z-index设成1000了，所以导致他遮挡了，感谢大佬~

[很明显我是猪头]

引用 2 楼 MOONCOM 的回复:

你的问题出在CSS .zz中的 opacity:0.5; 解决方法： 将 .zz中的opacity:0.5; 去除。然后下面两种方法任选一种 1、将<div class="zz">放在<div class="load">前面 2、在CSS 的 .load中，添加 z-index:9;

把opacity:0.5;去除后，就直接显示颜色，而不显示透明，我做的是半透明遮挡层，z-index改为9并不管用，zz里面我把z-index设置成了1000，所以就算load的z-index改成9，它也是在zz下面，依然要被遮挡，正确方式就是：把load的z-index改得比zz大，这样它就显示在最前了。 不过谢谢你的回答，感谢你的热心帮助~

[很明显我是猪头]

引用 3 楼 yanluofeihong 的回复:

设置z-index。z-index的值越大，显示的越靠前，所以zz的z-index值要写的小一些设置为2，load的z-index设置为3就可以实现你要的效果了

哈哈，我一看到你的回答就懂了，真的很感谢你，让我明白了z-index的正确用法，谢谢~

[霜月枫桥]

你的问题出在CSS .zz中的 opacity:0.5; 解决方法： 将 .zz中的opacity:0.5; 去除。然后下面两种方法任选一种 1、将<div class="zz">放在<div class="load">前面 2、在CSS 的 .load中，添加 z-index:9;

[看着是个昵称]

设置z-index。z-index的值越大，显示的越靠前，所以zz的z-index值要写的小一些设置为2，load的z-index设置为3就可以实现你要的效果了