css常见样式（下）

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

作用：定义行内内容（如文本、i图片等）相对于它的块级父元素居中
作用在行内元素中
作用在它的块级父元素中

问题2：IE 盒模型和W3C盒模型有什么区别

ie盒模型：元素的宽=content的宽+padding的宽+border的宽
W3C盒模型（标准盒模型）：元素的宽=content的宽

示例

在IE5.5和以及更早的IE版本中，IE都采用了IE盒模型，从IE6开始提供了一种IE使用W3C盒模型的方式：在html中声明Doctype。但是，IE6默认的仍是IE盒模型。
在css3.0中加入了box-sizing，用来修改css box model，默认值是content-box（标准盒模型），border-box值设置IE盒子。

---

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

声明body里面元素采用IE盒模型

问题4：line-height: 2和line-height: 200%有什么区别

• line-height: 2表示行高为当前字体高度的2倍
• line-height: 200%表示行高为默认字体行高的2倍，也就是32px，为定值。

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

特性：既有行内元素的特性（不占据一整行），也有块级元素的特性（可设宽高、margin和padding值在水平及竖直方向均有效）

未设inline-block时
设置inline-block时
去除缝隙：两个span元素之间有空格，以字符的形式出现，设置它字符的字体大小为0，即可清除，见下图
去除缝隙

顶端对齐:vertical-align:top;

---

问题6：CSS sprite 是什么?

CSS Sprite，是一种通过CSS技术将原本需要多张图像文件分别显示，整并为单一图像文件的分区显示技术，借由减少下载图像文件数量，提高网页的显示性能

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

• opacity:0 ：透明度为0，整体
• visibility: hidden：和opacity:o类似
• color: transparent ：同上
• display: none：消失，不占用位置

---