CSS常见样式（下）

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

• text-align作为HTML元素属性其主要是用来文本水平居中的。
• text-align属性只能针对文本文字和img标签，对其他标签无效。

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

• W3C标准中padding、border所占的空间不在width、height范围内
• IE的盒模型width包括content尺寸＋padding＋border

d3bbc6ef43b6c4d1f883ffc458e6267538d16a6f.JPG
503315ee47e0efa18426508d4f0604415f39e395.JPG

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

• 是CSS3的新样式，使用IE盒模型的样式。

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

• line-height：2：本身文字的2倍的高度。
• line-height：200% ：是相对于父容器，父元素高度的2倍。

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

• inline-block
  既呈现 inline 特性(不占据一整行，宽度由内容宽度决定)
  又呈现 block 特性 (可设置宽高，内外边距)
• 缝隙问题：
  1.可以将两个元素挨在一起，不换行
  2.也可以用div包裹住，然后把font-size：0设置
• 可以设置其中一个元素中加vertical-align:top

CSS sprite 是什么?

• CSS精灵图，把图片拼接到一张图片上来实现css样式，以节约请求。

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

• opacity: 0 ; 透明度为0，整体
• visibility: hidden ;本身还是存在的，浏览器也知道 和opacity:0 类似
• display:none; 消失，不占用位置
• background-color: rgba(0，0，0，0.2) 只是背景色透明