1.text-align: center的作用是什么，作用在什么元素上？能讓什么元素水平居中
- 作用在行內元素上，實現行元素居中。常常對塊級元素設置，作用在塊級元素的內聯子元素上，內聯子元素會在父級塊元素中居中。
2.IE 盒模型和W3C盒模型有什么區別?
IE盒模型的width和height包含了content和padding，border，W3C盒模型的width和height只包含content。
寬度的計算是這樣的：
- W3C盒模型：總寬度 = margin-left + border-left + padding-left + width + padding-right + border-right + margin-right
- IE盒模型：IE盒模型的計算方式和W3C的很相似，但有一點是非常不同的，這就是：填充和邊框并不被包含在計算的范圍內。
總寬度 = margin-left + width + margin-right
這就意味著一旦元素擁有橫向的填充和/或邊框，實際的內容區域就要擴大來創造出他們占據的空間。
圖解：
box-model.gif
具體的事例可以參考這里的文章，這里說的很詳細，
參考資料
參考資料2（翻譯）
3.*{ box-sizing: border-box;}的作用是什么？
box-sizing: border-box
```的作用是將當前元素設置為IE盒模型，主要為了排版計算方便。
4.line-height: 2和line-height: 200%有什么區別?
---
- ```line-height: 2```表示行高為本身字體高度的兩倍，
- ```line-height: 200%```表示設置行高為父元素字體高度的200%高度。
5.inline-block有什么特性？如何去除縫隙？高度不一樣的inline-block元素如何頂端對齊?
---
inline-block呈現行內元素的特性，不占據一整行，寬度大小由內容決定，同時又有塊級元素的特性，可設置寬高和內外邊距。
縫隙的問題是由于兩行之間有很多空白字符，瀏覽器都會當作一個文字。
解決方式：
1. 把html寫到一起
2. 將父元素的font-size屬性設置為0，再在inline-block元素上設置自身的font-size。
兩個inline-block元素不能對齊的問題是由于inline元素默認是基于baseline對齊的，要手動設置vertical-align為:top
6.CSS sprite 是什么?
---
雪碧圖|精靈圖.
把網頁中一些背景圖片整合到一張圖片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的組合進行背景定位，background-position可以用數字精確的定位出背景圖片的位置。
利用CSS Sprites能很好地減少網頁的http請求，從而大大的提高頁面的性能。
> **不過，現在常用的是字體圖標的形式去完成頁面中的logo圖片等需求。
最流行的目前是使用SVG實現**
代碼：
---
[sprite代碼](http://js.jirengu.com/yidaweyudo/1/edit)
[iconfont代碼](http://js.jirengu.com/culeretimu/1/edit)