淘先锋技术网

首页 1 2 3 4 5 6 7

在开发网页时,经常要通过设置背景图来美化网页的样式,CSS提供了多种方式来实现这个目标。

其中,最基本的方式是使用background-image属性来添加背景图。其语法如下:

background-image:url('图片地址');

其中,图片地址需要填写正确的图片路径。如果网页中有多个元素需要添加背景图,我们可以使用通配符*来选择所有元素,如下:

* {
background-image: url('图片地址');
}

另外,我们还可以通过设置背景重复、位置等属性来控制背景图的展示效果。常用的属性包括:

background-repeat: no-repeat;  //不重复显示图片
background-position: center top;  //背景图居中显示
background-size: cover;  //自适应铺满整个容器

例如,我们想在网页顶部添加一个背景图,并且让它居中显示且不重复,可以这样设置:

html, body {
height: 100%;
}
header {
background-image: url('图片地址');
background-repeat: no-repeat;
background-position: center top;
height: 100%;
}

这样,我们就能成功添加一个美观的背景图了。