html浮动后背景图移动

设置html背景图像位置的方法是在背景图像中添加背景位置属性，然后单击【背景位置： center； 】。

正文 *** 作环境： windows10系统、html 5、thinkpad t480电脑。

如果要在html代码中移动背景图像的位置，可以使用背景位置属性。 很多学生可能还不知道这个属性，下面介绍这个属性。

背景位置属性用于设置背景图像的开始位置。

一般属性值如下： 左顶

左中心

左底

光之最

代码示例：

php中文网(php.cn ) body

{

背景图像： URL (smiley.gif )；

后台- repeat :否- repeat；

后台-附件：固定；

背景定位：中心；

}

注意：此属性在Firefox和Opera中运行，后台附件属性设置为“固定”。

可以将上面的代码本地复制，然后运行以查看效果。

1、首先打开前端开发工具，新建一个html代码页面。

2、在html代码页面上创建一个用于设置背景颜色的div标签，然后给这个标签添加上class = "bg-img"。

3、设置背景图片。创建style标签，然后在标签里面对类为bg-img设置背景图片、图片不重复、宽、高的样式。

4、保存html代码，使用浏览器打开，这个时候会发现浏览器上的背景图片显示在左上角。

5、回到html代码页面，在bg-img类里添加background-position: center的属性。

6、保存html代码后重新刷新浏览器，这个时候会发现浏览器上的背景图片已经自动居中了。

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

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

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

---