CSS常见样式2

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

作用是使inline 和inline-block的元素居中。

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

• IE盒模型：width或height=内容宽度或高度+paddingx2+borderx2

  
  
  

  ie盒模型

• W3C盒模型： width和height=内容的宽度或高度

  
  
  

  w3c盒模型

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

把页面上所有的盒模型设置为IE盒模型

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

• 2:行高为字体本身高度的2倍

• 200%:行高为父容器字体高度的2倍

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

• 特性：（同时具有行内元素和块级元素的特性）

• 行内元素（可以多个元素占据一行）

• 设置宽高有效

• 设置padding ,margin有效

• 去缝隙

• 去掉代码中的空格和换行b，设置font-size:0

• inline-block元素顶端对齐

• 设置vertical-align基线的位置来对齐元素vertical-align:top

6.CSS sprite 是什么?

是精灵图，即将瓦部分在嘎巴所需的图片整合到一张图里，然后分别在所需的部位分别展现。可以减少图片请求，减轻服务器压力。

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

• 任然存在网页中本身的位置

• visibility:hidden (可见度状态隐藏)
  整块的透明度： opacity:0

• background-color:rgba(0,0,0,0.5) 蒙上一层遮罩

• 不存在网页中

• display:none;

代码

1
2