h5怎么设置层级关系？

层级关系的布局有两种解决方法：

1.是使用标签的自然顺序和嵌套顺序来形成合理的布局。

2.而第一种方法却不是万能的，有时候我们需要将原本位于下层的元素移到另一个元素上方，那可以使用z-index；z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 注释：Z-index 仅能在定位元素上奏效（position属性值设置除默认值static以外的元素，包括relative，absolute，fixed样式）

如何使用Z-index呢？

首先使用z-index需要先加上position:absolute/relative定位。

其次你要知道z-index 是要考虑父级的，如果子级z-index为0，那么父级就是200000也不会覆盖住子级。

最后在标准浏览器中，对父级的要求不是特别高，同级的对应上z-index可以了。但要注意的是父级里放一个子级那么父级是无法放在子级之上的，需要放在同一级别中才可以（经过测试的），如果想要父级覆盖子级，那么父级不需要设置z-index，只要孩子设置就z-index就可以了。

1、新建一个html文件，命名为test.html，用于讲解html如何将一个div置于最上层。

2、在test.html文件内，使用div标签创建两个模块，并分别设置它们的id为testone，testtwo。

3、在css标签内，统一设置div的样式，定义它们的位置属性为绝对定位，宽度和高度为300px。

4、在css标签内，设置id为testone的样式，定义其背景颜色为红色，同时使用z-index属性定义其为最上层。

5、在css标签内，设置id为testtwo的样式，定义其背景颜色为蓝色，距离左边和距离上边的位置为20px。

6、在浏览器打开test.html文件，查看实现的效果。

首先背景图片一定是在背景颜色上面的，而背景图片一定是在内容下面的。要不然就不会叫做背景了。但是你这样的需求也是可以做的。

首先你设置一个div,根据根元素进行定位，width：100%height:100%position: absolute；top：0；left：0z-index:999  然后在里面放图片，设置display:blockwidth:100%这样就相当于设置了一个背景，然后你在其他地方设置的图片就会在这个图片（背景）的下面了。

这个是页面代码，图片你设置成你自己的就行。

请点击输入图片描述

---