text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中?
- 作用在行内元素上
- 让文本水平居中
IE 盒模型和W3C盒模型有什么区别?
*{ box-sizing: border-box;}的作用是什么?
设置 box-sizing:border-box 的元素可以使用IE盒模型
默认(设置 box-sizing:content-box 即为W3C盒模型)
line-height: 2和line-height: 200%有什么区别?
line-height: 2——————行高为当前元素字体大小的2倍
line-height: 200%————行高为父容器字体大小的2倍
inline-block有什么特性?如何去除缝隙?高度不一样的inline-block元素如何顶端对齐?
(1)
inline-block 可以让元素具有块级元素和行内元素的特性:既可以设置长宽,可以让padding和margin生效,又可以和其他行内元素并排。
(2)
(3)
CSS sprite 是什么?
CSS精灵图或雪碧图,是一种通过把需要请求的图片整合为一张图片然后用css获取需要区域的方法。
优点:可以减少对图片请求次数,提高网页加载性能,减少服务器的运算压力。
缺点:图片不能缩放,每次需要新加入图片就要重新做一张整合图。
让一个元素"看不见"有几种方式?有什么区别?
方式 | 区别 |
---|---|
opacity:0 | 设置整体透明度为0 , 占空间 |
display:none | 设置消失,不占空间 |
visibility:hidden | 设置隐藏,和opacity类似,占空间 |
background-color:rgba(0,0,0,0) | 设置背景透明度为0 |
使用 CSSsrpite 实现如下效果
代码:http://js.jirengu.com/yetehisexu/1/