1、text-align: center的作用是什么，作用在什么元素上？能讓什么元素水平居中?
- 能讓塊級元素中的行內元素水平居中，作用在行內元素的父元素上，讓行內子元素在父容器中居中。
2、IE 盒模型和W3C盒模型有什么區別?
- W3C標準盒模型中，padding、border所占的空間不在width、height范圍內。
Paste_Image.png
- IE盒模型中，padding、border所占的空間在width、height范圍內，即width/height=content+padding+border。
3、*{ box-sizing: border-box;}的作用是什么？
- 指定使用IE盒模型，那么設置的width和height包含了content+padding+border。
4、line-height: 2和line-height: 200%有什么區別?
line-height 設置單行文本的行高，
line-height: 2 行高=本身文字大小的2倍
line-height: 200% 行高=父元素文字高度的2倍。
5、inline-block有什么特性？如何去除縫隙？高度不一樣的inline-block元素如何頂端對齊?
- inline-block特性：
1）既呈現inline特性（不占據一整行，寬度由內容寬度決定）。
2）又呈現block特性（可設置寬高，內外邊距）。
3）存在縫隙問題。 - 如何去除縫隙：
1）消除html里的空白字符
2）將空白字符大小設為0
在父容器里設置font-size:0；
Paste_Image.png
- inline-block元素頂端對齊：通過設置
vertical-align:top;
6、CSS sprite 是什么?
- 將多個圖片合成為一個圖片（一張png格式的圖片包含多個圖標），將合成的圖片設置為背景圖片，通過設置background-position屬性及父容器大小，使之在合適的位置顯示不同的圖標。
- 優點：減少請求數量；缺點：無法縮放，不好修改。
7、讓一個元素"看不見"有幾種方式？有什么區別?
opacity: 0; 透明度為0，占用位置
visibility: hidden; 隱藏，與opacity: 0;類似，占用位置
display: none; 消失，不占用位置
background-color: rgba(0,0,0,0.2)只是背景色透明
