[TOC]
## 1.漸變色
### 一半藍一半綠
```
background: linear-gradient(to right, blue 50%, green 50%)
```
## 2.背景吸附
```
background: url(1.jpg) no-repeat;
background-attachment: fixed; //背景圖片相對視圖窗口固定
background-attachment: scroll //背景圖片隨窗口滾動而滾動
```
## 3.雪碧圖
```
background-position：-xpx -ypx;
```
雪碧圖就是將所有的小圖標放到一張圖片上，通過移動背景來顯示相應的圖片，
好處是，減少了頁面對圖片的加載，網頁的http請求
替代方案 用iconfont代替
iconfont的好處：
1. 自由變化大小
2. 自由修改顏色
3. 可以添加一些視覺效果如：陰影、旋轉、透明度。
4. 兼容IE6
