z-index层不覆盖问题
答案:1 悬赏:50 手机版
解决时间 2021-05-12 11:48
- 提问者网友：趣果有间
- 2021-05-11 11:36
z-index层不覆盖问题
最佳答案
- 五星知识达人网友：青灯有味
- 2021-05-11 12:21
#L1 #L1 #L2 <div id="L1"><img.../><div id="L2"></div></div> 想用上面的代码实现在img上面盖一层图，不过在IE6里层L2高度不会随L1高度变化，IE7和FF2则可以。这个要怎么办呢 下面我们着手解决这个问题，首先，需要告诉浏览器我们的body的高度不是未定义的，而是100%。 div2是div1的子对象。若想让子对象适应父对象的高度，首先就要获取父对象的高，才对去适应它。 div2是层又叠在父对象div1之上的，我们要明确他们的层叠关系。 好了，有了上面的基本思路，下面我们动手编码：* body #div1#div1 #div2<div id="div1"><img src=" http://www.52css.com/skins/logo3.gif" /><div id="div2">div div2</div></div> 我们看下面的运行效果。我在IE6和FF下面测试通过！<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns=" http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>我爱CSS - www.52css.com 在一个层上面覆盖一个高度自适应的透明层</title><style type="text/css">body #div1 #div1 #div2</style></head><body><div id="div1"><img src=" http://www.52css.com/skins/logo3.gif" /><div id="div2">divs2</div></div></body></html> 我们运行机制所看到的是，本站的logo3在div1中，div2填充了颜色#c00，设置了半透明的效果。div2中的文字层叠在div1之上。div2自动适应div1在高度上的变化。 你可以在上面的运行代码中的XHTML部分加上：<br /><img src=" http://www.52css.com/skins/logo3.gif" /> 再次查看运行效果。得到了div2自动适应div1在高度上的变化。
我要举报
如以上问答信息为低俗、色情、不良、暴力、侵权、涉及违法等信息，可以点下面链接进行举报！
大家都在看
推荐资讯