背景的概念
在CSS中，背景是指元素的背景部分，可以是颜色、图像或者是两者的组合。设置背景的目的是为了美化页面，并增加页面的可读性。
背景颜色
使用background-color属性设置背景颜色
通过使用CSS的background-color属性可以设置元素的背景颜色。这个属性可以取值为颜色名、十六进制值或者RGB值。
.element {
background-color: blue;
}
在上面的例子中，设置了元素的背景颜色为蓝色。可以看到元素的背景变成了蓝色。
背景图像
使用background-image属性设置背景图像
通过使用CSS的background-image属性可以设置元素的背景图像。这个属性可以取值为图像的URL。
.element {
background-image: url("image.jpg");
}
在上面的例子中，设置了元素的背景图像为名为image.jpg的图片。可以看到元素的背景变成了这张图片。
使用background-repeat属性控制背景图像的重复
背景图像默认会重复显示，可以通过使用CSS的background-repeat属性来控制背景图像的重复情况。
.element {
background-repeat: no-repeat;
}
在上面的例子中，设置了元素的背景图像不进行重复显示。这样可以保证背景图像只在元素内显示一次。
使用background-position属性控制背景图像的位置
背景图像可以通过使用CSS的background-position属性来控制其在元素中的位置。
.element {
background-position: center;
}
在上面的例子中，设置了元素的背景图像在水平方向上居中显示。这样可以让背景图像在元素中居中显示。
使用background-size属性控制背景图像的尺寸
背景图像可以通过使用CSS的background-size属性来控制其在元素中的尺寸。
.element {
background-size: cover;
}
在上面的例子中，设置了元素的背景图像按照元素的尺寸进行缩放。这样可以保证背景图像始终覆盖整个元素。
背景属性的简写
上面介绍的背景属性可以分别设置，也可以使用CSS的背景属性进行简写。
.element {
background: blue url("image.jpg") no-repeat center/cover;
}
在上面的例子中，使用了CSS的背景属性对背景进行了简写。其中，background-color设置了背景颜色为蓝色，background-image设置了背景图像为名为image.jpg的图片，background-repeat设置了不进行重复显示，background-position设置了在水平和垂直方向上都居中显示，background-size设置了按照元素的尺寸进行缩放。
总结
通过上面的介绍，我们了解了如何设置背景颜色、背景图像以及使用简写的背景属性来设计页面的背景。背景的设置可以帮助我们美化页面，并提高页面的可读性和吸引力。