【从零开始学前端】day3——CSS Background（背景）

CSS的background属性定义了HTML元素的背景，主要包括：background-color（背景颜色）、background-image（背景图像）

一、背景颜色 background-color

background-color属性定义了HTML元素的背景颜色，例如下列代码将body背景色设置成红色：

body {
  background-color:red;
}

二、背景图像 background-image

background-image属性定义了HTML元素的背景图像。

默认情况下，背景图像进行平铺重复显示，以覆盖整个元素实体。

body {
  background-image:url('bgc.gif');
}

上述代码会将图像在水平和垂直方向平铺。如果期望图像仅在水平方向平铺，则可加入background-repeat属性

body {
  background-image:url('bgc.gif');
  background-repeat:repeat-x;
}

如果不想对图像进行平铺，可将background-repeat属性设置为no-repeat，另外增加background-position属性调整图像位置

body {
  background-image:url('bgc.gif');
  background-repeat:no-repeat;
  background-position:50px 100px;
}

书写规范：

Background属性的书写顺序如下：

background-color

background-image

background-repeat

background-position