多语言展示
当前在线:1996今日阅读:27今日分享:41

如何让背景图片自适应填充整个屏幕

在做网页的时候,我们想让图片填充整个屏幕,就是一张图片拉伸的效果,而且可以适应不同大小的屏幕,这个怎么做呢?来看看小编的介绍吧。
工具/原料
1

Dreamweaver 相关软件

2

图片

方法/步骤
1

首先我们用Dreamweaver软件做一个html文档,当然用其他编辑器也可以。

2

然后给body设置一个背景图片,这里小编给body加了一个高度,以便能看到图片。

3

然后先在浏览器中预览一下效果。会看到图片两遍有空白,没有填充满整个屏幕。

4

那么怎么让背景图片自适应屏幕大小呢?其实只要一个简单的属性即可,就是background-size,可以设置其值为100%。

注意事项

css3新增属性,低版本浏览器不支持。

推荐信息