CSS 基础（三） web前端基础 [CSS背景颜色，三大特性]

一、CSS的背景

CSS 可以添加背景颜色和背景图片，以及来进行图片设置。
背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等等。

属性	描述
background-color	背景颜色
background-image	背景图片的地址
background-repeat	图片是否平铺
background-position	背景位置
background-attachment	背景固定还是滚动
背景的合写（复合属性）
background:背景颜色 背景图片地址 背景平铺 背景滚动 背景位置

1.1 背景颜色

background-color属性定义了元素的背景颜色。
语法：
background-color:颜色值;
注意：
一般情况下，元素背景颜色默认值是transparent（透明）

1.2 背景图片

background-image描述背景的图片。实际开发常见于 logo 或者一些装饰性的小图片或者是超大的背景图片, 优点是非常便于控制位置。
语法：

background-image : none | url (url) 

参数：
none : 　无背景图（默认的）
url : 　使用绝对或相对地址指定背景图像

小技巧： 我们提倡 背景图片后面的地址，url不要加引号。

注意：
background-image 属性允许指定一个图片展示在背景中（只有CSS3才可以多背景）可以和 background-color 连用。 如果图片不重复的话，图片覆盖不到的地方都会被背景色填充。 如果有背景图片平铺，则会覆盖背景颜色。
背景颜色会置于底层，在背景图片下。

1.3 背景平铺

background-repeat 属性可以设置背景图片的平铺。

background-repeat : repeat | no-repeat | repeat-x | repeat-y 

参数值	描述
repeat	背景图像在纵向和横向上平铺（默认的）
no-repeat	背景图像不平铺
repeat-x	横向平铺
repeat-y	纵向平铺

设置背景图片时，默认把图片在水平和垂直方向平铺以铺满整个元素。

1.4 背景位置

利用background-position属性可以改变图片在背景中的位置。
语法：

background-position : length || length
background-position : position || position 

参数	作用
length	百分数
position	top 、center 、 bottom | left 、 center 、 right ——方位名词

说明：