1.text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
- 作用是让元素的文本内容水平居中
- 写在块元素上，但并不控制块元素自己的对齐。只控制它的行内内容的对齐
- 能让块级元素内的文本内容水平居中
2.IE 盒模型和W3C盒模型有什么区别?
- IE盒模型
- IE盒模型的width和标准盒模型的width和height是指content的高度和宽度值加上border和padding的尺寸值。即width包括content尺寸＋padding＋border
IE盒模型.JPG
- W3C盒模型
- 标准盒模型的width和height是指content的高度和宽度值，不包括border和padding的尺寸值。即padding、border所占的空间不在width、height范围内
标准盒模型.JPG
3.*{ box-sizing: border-box;}的作用是什么？
- 设置当前页面的所有元素的盒模型样式符合IE盒模型样式
4.line-height: 2和line-height: 200%有什么区别?
- 为某个元素单独设置 line-height属性时，line-height: 2 和 line-height: 200% 的作用一样，正常情况下都是为这个元素设置行高为元素自身字体大小的两倍。当父元素的字体大小大于子元素到一定程度时，那么子元素的行高则为父元素字体大小的两倍，可以测试
- 当某元素的行高属性继承自父元素时，如果父元素设置的是 line-height: 2，当子元素字体小于父元素时，那么子元素的行高则为自身字体大小的两倍，反之则是父元素的两倍；如果父元素设置的是 line-height: 200%，那么子元素的行高则为父元素字体大小的两倍
不得不说这是一个奇怪的现象
5.inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐?
- 当一个元素的display属性设置为inline-block时，那么该元素既表现出行内元素的特性（不占据一行，宽度由内容宽度决定），又具有块级元素的特性（可设置宽高，内外边距）
- 去除缝隙
- 顶端对齐
- 使用vertical-align属性，属性值设置为top，即vertical-align：top;
6.CSS sprite 是什么?
- 精灵图（又名雪碧图）
- CSS sprite 是一种网页图片处理方式。它的做法是把网页中的零星图片（比如小图标）都合并到一张大图片中，然后利用 background-position 属性选择合适的图片，这样在加载网页的时候可以减少图片的请求次数，从而提高网页的加载速度
7.让一个元素"看不见"有几种方式？有什么区别?
- 有4种
-
opacity: 0元素的透明度为0，让元素不可见，但元素仍然占据原本的页面空间 -
visibility: hidden和opacity: 0类似，将元素隐藏，但元素仍然占据原本的页面空间 -
display:none让元素消失，不占用页面位置 - background-color：rgba（0，0，0，0.2）；设置背景色透明
