html网页制作中如何设置背景图片（如何引用）

1、首先打开Atom编辑器导入项目文件夹，先创建一个index.html的文件。定义一下html文件的主信息：

2、然后填写自己的网页内容， 设置一下样式，直接在body后面加上background="图片名字"即可插入图片：

3、最后来到浏览器，刷新一下网页，这样就会显示背景了：

在CSS样式中设置backgroud-image属性，代码如下：

<styletype="text/css">

body{

background-image:url(你的图片地址)

background-position:center

background-repeat:repeat-y；

}

</style>

说明：

1、background-image:url(你的图片地址)：指这张背景图存放的路径；

2、background-position：指这张背景图的位置。left（左）、right（右）、top（上）、bottom（下）可以取值，你要求图片居中，所以是“center”；

background-repeat：指图片平铺方式；一般都默认平铺，设置为no-repeat则是不平铺。你要求“y坐标平铺”所以是“repeat-y”。

1、用css的z-index的属性就可以实现。首先新建一个html文件，在文件中写入一个div容器和一个图片：

2、然后在上方设置它们的样式，这里给div设置成绝对定位，图片设置成相对定位，然后设置一下它们的z-index属性，该属性用来显示元素的上下层的叠加顺序，数值越大表示的层级越高，但是只有在有定位的情况下该属性才会生效。最后设置一下div的背景颜色方便观察效果：

3、最后打开浏览器查看效果，div是在图片上面的。以上html中就是把背景图片置于最低层的方法：

---