css学习之任务九

1 text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中

text-align 属性规定元素中的文本的水平对齐方式。它作用在块级元素上，让块级元素中的行内元素居中。

2 IE 盒模型和W3C盒模型有什么区别?

IE盒模型的宽度和高度是指border+padding+content的宽度和高度
W3C 标准盒子模型的宽度和高度是指content的宽度和高度

3 *{ box-sizing: border-box;}的作用是什么？

这个是css3的新样式。
box-sizing: border-box表示的是使用 IE 盒模型。
box-sizing: content-box表示的是使用W3C盒模型。

4 line-height: 2和line-height: 200%有什么区别?

line-height: 2:是它本身文字高度的两倍
line-height: 200%:是其父元素的两倍，指自己的content是父容器content的两倍。

5 inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐?

inline-block可以让元素具有块级元素的属性，可以设置宽高和margin以及padding，同时也具有行内元素的属性只占据内容本身的宽度。
存在缝隙是因为HTML书写时的换行和回车导致的，因为本身换行符也是一个字符，也会占用一个字符的空间，所以看上去就会有一个缝隙，解决方法就是先将有缝隙的两个子元素的父元素的font-size设置为0，然后在给对应的子元素设置自身的字体大小。
高度不一样的两个inline-block的元素默认是按照文字的底部对齐。
可以通过vertical-align来设置对齐方式;下面举例说明

举例说明

6 CSS sprite 是什么?

CSS Sprites（css精灵图）其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字精确的定位出背景图片的位置

7 让一个元素"看不见"有几种方式？有什么区别?

opacity：0；透明度为0
visibility:hidden;看不见但本身是存在的
display：none;消失，不占用位置
background-color：rgba(0,0,0,0.2)0.2是设置背景的透明度