四种背景属性：
    background-image：添加背景图片。不同的背景图像和图像用逗号隔开。
    background-size：指定背景图像的大小，可指定像素或者百分比的大小，是相对于父元素的宽度和高度的百分比的大小。
    background-origin：指定了背景图像的位置区域
    background-clip：背景裁剪属性是从指定位置开始绘制。
    CSS3渐变
    渐变可以让我们在两个或者多个颜色之间显示平稳的过渡。
    两种类型的渐变：
    Linear Gradients：线性渐变-向下/向上/向左/向右/对角方向
    Radial Gradients：径向渐变，由它们的中心定义
    线性渐变：
    语法：background：linear-gradient(direction, color-stop1, color-stop2, …);
    线性渐变默认情况是从上到下。
    从左到右的线性渐变：
    #grad {
    background: -webkit-linear-gradient(left, red, blue);
    background: -o-liner-gradient(right, red, blue);
    background: -moz-linear-gradient(right, red, blue);
    background: linear-gradient(to right, red, blue);/*标准语法*/
    }
    从左上角开始到右下角的渐变：
    设置方向为：left top/bottom right/to bottom right(标准语法下)
    使用角度对方向进行设置：
    这里的角度是指水平线和渐变线之间的角度。So 0deg将创建一个从下到上的渐变，90deg将创建一个从左到右的渐变。
    使用透明度：
    支持透明度，用于创建减弱变淡的效果。
    为了添加透明度，使用rgba()函数来定义颜色结点。rgba()函数中的最后一个参数可以是从0到1的值，它定义了颜色的透明度：0表示完全透明，1表示完全不透明。
    重复的线性渐变：
    repeating-linear-gradient()函数用于重复的线性渐变。
    径向渐变：
    我们可以指定渐变的中心、形状（圆形或者椭圆形）、大小，默认情况下，渐变的中心是center（表示在中心点），渐变的形状是ellipse（表示椭圆形），渐变的大小是farthest-corner（表示到最远的角落）。
    语法: background: radial-gradient(center, shape size, start-color, …, last-color);
    颜色结点分布不均匀的径向渐变：
    #grad{
    background: -webkit-radial-gradient(red 5%, green 15%, blue 60%);
    }
    Size参数定义了渐变的大小，可以是以下四个值：
    closest-side/farthest-side/closest-corner/farthest-corner
    重复的径向渐变：
    Reperting-radial-gradient()函数用于重复径向渐变。