text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
把文本排列到中间。作用在block元素上，能让块级元素内的inline元素和inline-block元素水平居中。
IE 盒模型和W3C盒模型有什么区别?
盒模型
-
W3C盒模型
- 总宽度 = margin-left + border-left + padding-left + width + padding-right + border-right + margin-right
-
IE盒模型
IE盒模型的计算方式和W3C的很相似，但有一点是非常不同的，这就是：填充和边框并不被包含在计算的范围内。
总宽度 = margin-left + width + margin-right
这就意味着一旦元素拥有横向的填充和/或边框，实际的内容区域（content area ）就要扩大来创造出他们占据的空间。
*{ box-sizing: border-box;}的作用是什么？
-
box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。
例如，假如您需要并排放置两个带边框的框，可通过将 box-sizing 设置为 "border-box"。这可令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。
line-height: 2和line-height: 200%有什么区别?
- 计算方法的区别。
数值：继承的时候，浏览器会先将line-height这个属性继承给子元素，再由子元素计算。
百分数：继承的时候，浏览器会先将行高对应的具体的数值计算出来以后再继承。
inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐?
- inline-block是结合了inline和block两者的特性于一身，简单的说：设置了inline-block属性的元素既拥有了block元素可以设置width和height的特性，又保持了inline元素不换行的特性。
- 缝隙是什么呢，它们是空白符。
- 要去除空白符产生的间隙，首先要理解空白符归根结底是个字符，通过设置font-size属性可以控制产生的间隙的大小。设置font-site属性为0px。
高度不一样的inline-block元素默认基线对齐，设置vertical-align：top 实现顶端对齐。
CSS sprite 是什么?
雪碧图；把小图片整成大图，减少请求，减轻服务器压力；
让一个元素"看不见"有几种方式？有什么区别?
- display:none;(脱离文档流 不占据位置)
- opacity:0，（透明但仍然在文档流中）。
- visibility:hidden,基本与opacity一致。
- text-indent:让某段文字彻底移走，表面上看不到，但是元素依旧在原地.
- z-index:设置为无限大的值如9999;或-9999让其覆盖或者被其他元素覆盖.(同级)
- 用一个<span>设置为inline-block，设置宽、高并让它移动到某个位置然后设置-背景色为白色，实现一个遮罩的方式。
实现雪碧图效果
- 使用 CSSsrpite 实现如下效果
9/19/2017
