css脚本中z-index属性起什么作用呢?


摘要:
下文讲述css代码中z-index属性的相关说明,如下所示:


z-index属性的功能说明:

z-index属性值用于定义当前元素在上下文中的层级
z-index越大显示越上,z-index值越小显示越靠下
同一个层中,元素的z-index值相同,则依据html渲染的顺序,依次显示元素


z-index语法:
z-index: auto|<integer>
———-参数值说明—–
auto:自动
interger:指定的层级值

 z-index属性注意事项:
       此属性需同定位属性一起使用,才能发挥起效果
 在html页面中,每一个元素都属于一个层级,当设置为auto值时,由系统自动分配其层级

例:
z-index 属性值示例说明

 <meta charset='utf-8' />
<p>
maomao365.com <br />
z-index属性值示例说明
</p>

<hr />
p标签根据z-index属性值排列
<style>
 div{position:relative;}
 div>p{position:absolute;}
.one{background:green;width:100px;z-index:10;}
.two{background:blue;width:120px;z-index:3;}
 
</style> 
 
<div>
	<p class="one">one</p>
</div>
<div>
	<p class="two">two</p>
</div>
css中z-index属性值的功能说明

css中z-index属性值的功能说明