css常见样式2

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

  text-align: center的作用是定义行内内容相对于它的块级父元素水平居中；
                    text-align并不控制块元素自己，而是它的行内内容。

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

    ie定义的宽高包content、padding、border，w3c仅仅指content。
    如图：

![ie.JPG . . .] 标准.JPG

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

  模拟ie盒模型，如有内边距、描边，宽高包含内容+内边距+描边，不用再换算。

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

    line-height: 2 自身元素字体大小*2，先继承2这个倍数，再遍历计算，值是动态的
   line-height: 200%  父元素字体大小*2，先算出来然后继承，值是固定的

line-height: 2 .png line-height: 200% .png

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

    inline-block：兼具block可以设置宽高，inline的不独占一行,默认宽高为内容宽高的特点。
    去除缝隙：1.inline-block元素紧挨，没有空隙和换行
             2.inline-block的父元素font-size:0;.inline-block再自行设定字体大小
             3.inline-block元素设置浮动
    高度不一样的inline-block元素如何顶端对齐：vertical-align:top;

6.CSS sprite 是什么?

CSS sprite是CSS雪碧图，指将不同的图片/图标合并在一张图上。
使用CSS Sprite 可以减少网络请求，提高网页加载性能。

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

  opacity: 0 ; 整体包括这个元素内的其他元素透明度为0，占位。
  visibility: hidden ; 和opacity:0 类似
  display:none; 消失，不占用位置