text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
作用是使行内元素与文本水平居中；作用在块级元素中，能让行内元素与文本水平居中。
IE 盒模型和W3C盒模型有什么区别?
W3C标准中padding、border所占的空间不在width、height范围内，大家俗称的IE的盒模型width包括content尺寸＋padding＋border。
*{ box-sizing: border-box;}的作用是什么？
把整个页面的所有元素默认的W3C盒模型标准转化为IE盒模型标准。
box-sizing: content-box：w3c标准盒模型
box-sizing: border-box：“IE盒模型”
line-height: 2和line-height: 200%有什么区别?
line-height: 2;，不能被子元素继承，设置为自己文本文字大小的两倍。
line-height: 200%;，能被子元素继承，设置为父容器文本文字大小的两倍。
inline-block有什么特性？如何去除缝隙？高度不一样的inline-block元素如何顶端对齐?
即呈现inline特性（不占据一整行，宽度由内容宽度决定）又呈现block特性（可设置宽高，内外边距）。
去除缝隙：
- 标签之间不使用空格和回车键。
- 在其父元素设置font-size:0;，然后在inline-block元素内恢复font-size。
在inline-block元素中设置vertical-align: top;可以使不同高度的inline-block元素顶端对齐。
CSS sprite 是什么?
指将不同的图片/图标合并在一张图上。
使用CSS Sprite 可以减少网络请求，提高网页加载性能。
让一个元素"看不见"有几种方式？有什么区别?
- display:none;
- 浏览器不会生成属性为display: none;的元素。
- display: none;不占据空间（毕竟都不熏染啦），所以动态改变此属性时会引起重排。
- display: none;不会被子类继承，子类也是不会显示的。
- display,是个尴尬的属性，transition对她无效。
- visibility: hidden;
- 元素会被隐藏，但是不会消失，依然占据空间。
- visibility: hidden会被子类继承，子类也可以通过显示的设置visibility: visible;来反隐藏。
- visibility: hidden;不会触发该元素已经绑定的事件。
- visibility: hidden;动态修改此属性会引起重绘。
- visibility,transition对它无效。
- opacity: 0 ;
- opacity: 0 ;只是透明度为100%,元素隐藏，依然占据空间。
- opacity: 0 ;会被子元素继承,且子元素并不能通过opacity:1;进行反隐藏。
- opacity: 0 ;的元素依然能触发已经绑定的事件。
- opacity,transition对它有效。
- background-color: rgba(0，0，0，0)；
- 只是背景色透明。
网友评论