text-align: center 的作用，作用在什么元素上， 能让什么元素水平居中
text-align: center ; 单行文本水平居中
作用在块级元素中的行内元素上，能让块级元素的行内子元素居中。
IE盒模型 和 W3C标准盒模型有什么区别
IE盒模型 width = 内容宽+padding+border
W3C标准盒模型 width = 内容宽
*{box-sizing: border-box; } 的作用
border-box :是指IE盒模型
设置为当前的盒模型为IE盒模型，相对于标准盒模型，ie盒子的宽度 是元素的整个宽度，不用计算，利于排版和计算方便 。
line-height: 2 和 line-height: 200% 的区别
line-height: 2 行高是文本自身字体大小的2倍
line-height: 200% 行高为父元素的字体大小的200%的高度 ，200%=2
继承区分：
line-height: 2 继承的是父元素中设置的line-height: 2
line-height: 200% 继承了父元素的line-height: 200% 计算后的最终值，而不是
200% 。 最终值= font-size * 200%
inline-block 的特性
如何去除缝隙
高度不一样的iline-height 元素如何顶端对齐
（1）inline-block
既有行内元素特性+ 块级元素特性
在同一行上并列排序
可以设置元素的width、height padding margin
（2）产生原因：有缝隙是因为浏览器认为元素与元素之间存在空白字符，如空格 回车等，就默认元素间有缝隙
解决方案：
方法1 ：可以直接不留空白，前一个元素的标签紧挨着后一个标签。
方法2 ： 将父元素的字体设置为font-size: 0;
行内元素再单独设置字体大小即可。
（3） 顶端对齐 vertical-align: top;
其他属性值：middle (居中对齐)
bottom(底端对齐)
CSS sprite是什么
css精灵图(雪碧图)
用一张png的图片放置所有的小图标，使用这张图作为背景图，设置backgrond-position:来显示不同的图标。
这样减少图标想服务器的请求次数，提高加载速度。
让一个元素看不见有几种方式。
有什么区别
opacity: 0; 透明，整体透明，但还占据位置
visibility: hidden; 隐藏，看不见，但有位置，与opacity 类似。
display: none; 元素消失，不占据位置
background-color：rgba(0,0,0,0) 背景色透明，但是其子元素不透明
代码1
css sprite https://jsbin.com/pidavavemu/edit?html,css,output
网友评论