z-index不设置也是一样的效果 为什么还要添加呢

z-index不设置也是一样的效果 为什么还要添加呢

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">	
	<title>CSS布局</title>
	<style type="text/css">
		*{
			margin: 0;
			padding:0;
		}
		img{
			width: 380px;
			height: 240px;
		}
		.img-top{
			width: 380px;
			height: 240px;
			background-color: black;
			position: absolute;
			top: 0;left: 0;
			opacity: 0.5;
			z-index: 1;
		}
		
	</style>
</head>
<body>
<nav>
</nav>
	<div>
		<img src="http://img1.sycdn.imooc.com/climg//58f829ca00010be703840240.jpg">
	</div>
	<div class="img-top"></div>
	
</body>
</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
樱桃小胖子 2019-06-17 11:37:21

本次练习不设置也可以实现效果。但是z-index是设置层级的,当多个元素设置了定位时,需要使用z-index设置层级,从而控制显示

希望可以帮到你!

  • 提问者 钟大白 #1
    也就是说,有多个层重叠的话,设置展示的顺序是吧
    2019-06-17 12:21:51
  • 樱桃小胖子 回复 提问者 钟大白 #2
    是哒 ,可以这么理解哦
    2019-06-17 13:32:38
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师