任务9-css常见样式2

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

作用在行内元素上，实现行元素居中。

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

IE的盒模型中内容部分包含着border padding的空间，但是标准盒模型中内容部分，boeder，padding，margin 都是有各自的独立空间的

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

这样设定的作用是，将所有元素设定为IE盒模型。将border，padding的所占空间在已经设定好宽高的盒子内部中来体现出来。

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

line-height:2指行高为文字大小的2倍，而line-height: 200%的意思是，以父元素文字的字号大小为基准，行高为父元素字号大小的两倍。

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

特性
让元素既有块儿元素的特性（可设置宽高和内外边距..）又有行内元素的特性（不占据一整行，宽度大小由内容决定）。类似于<img>标签的感觉

去除缝隙
方法有3种，但是只有一种不怎么破坏html的代码写法，那就是找到inline-block元素的父元素，给这个父元素来个font-size: 0;这样缝隙就没有啦！

高度不一样的inline-block元素如何顶端对齐
给设定inline-block的元素再添加一个样式，那就是vertical-align: top;,这样就顶部对齐了~

CSS sprite 是什么?

• CSS sprite在国内叫做‘雪碧图’或者‘精灵图’，老师更提倡后者的叫法

• 用精灵图的目的就在于，减少哪些小图标的请求次数，以实现提升页面性能的目的。

• 原理以及用法，将不同的图片/图标合并到一张图片上，通过background-image来加载，通过background-position来定位，'开窗'实现不同图标的展示。

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

1. 给元素设定 display：none;属性，让他彻底变没，他的位置会被其他元素占据取代，引起浏览器对页面的重排，重绘。

2. 给元素设定 visibility:hidden属性，元素只是视觉上消失了，实际上，元素所在的位置和所占空间依旧会保留着，不会导致页面重排，但是会重绘。

3. 将元素的透明度设置为0（opacity:0），这样元素也会看不到，在页面中的特点与visibility:hidden相近，都不会改变页面布局，不用重排页面

代码题

代码题答案集合