1.text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
让文本居中，作用在行内元素上，能让行内元素水平居中。
2.IE 盒模型和W3C盒模型有什么区别?
IE盒模型的宽度和高度包括border+padding+content,而W3C的宽度和高度只包括content
3.*{ box-sizing: border-box;}的作用是什么？
将标准盒模型改为ie盒模型
4.line-height: 2和line-height: 200%有什么区别?
line-height：2指的是行高相对当前元素字体大小的2倍，而line-height：200%指的是行高相对根元素字体大小的2倍，例如
主要区别还是2内部继承的是未经过计算的，line-height:200%是经过计算的。因为line-height:继承属性和其他css不一样的地方是根据font-size:px数值进行计算的。
(1) 当line-height:xxx %时：
body{ font-size:14px; line-height:200%; }
h1{ font-size:20px;}
实际结果就是：
body{ line-height:28px; /* 14px200%=28px / }
h1{ line-height:28px; }
(2) 当line-height:2时：
body{ font-size:14px; line-height:2; }
h1{ font-size:20px; }
实际结果就是：
body{ line-height:28px; / 14px2=28px / }
h1{ line-height:40px; / 20px*2=40px */ }
5.inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐?
dispiay: inline-block; 既呈现inline的特性，不占据一整行，宽度由内容宽度决定，有呈现block的特性，可设置宽高，内外边距。
去除间隙可以在html中把产生间隙的两标签挤在一起，不留空格；也可以在css中在父元素外设置font-size：0；，然后再再子元素中单独把字体设置回去。
达到顶端对齐，可以给inline-block元素添加vertical-align:top
6.CSS sprite 是什么?
精灵图，指将不同的图片或者图标合并在一张图上，使用精灵图可以减少网络请求，提高网页加载性能
7.让一个元素"看不见"有几种方式？有什么区别?
- opacity：0；整体透明度为零
- visibility：hidden：和opacity类似
- display：none；消失，不占用位置
- background-color：rgba（0，0，0，0.2）；设置背景色透明
网友评论