文档介绍：web前端开发面试题，易莱胜web前端开发培训面试题
热点：百读易莱胜官网
上海易莱胜
易莱胜
上海百读易莱胜
?
行元素转换为块级元素方法：display：block；
?清除浮动有多个方法?
将多个元素设置为同一行：position,float，inline-block
清除浮动方法：方法一：添加新元素、 clear：both；
方法二：父级div定义 overflow: hidden；
方法三：利用:after和:before来在元素内部插入两个元素块，从面达成清除浮动效果。
.clear{zoom:1;}
.clear:after{content:””;clear:both;display:block;height:0;overflow:hidden;visibility:hidden;}
-sizing？弹性盒模型|盒布局?
在标准模式下盒模型：
盒子总宽度/高度=width/height+padding+border+margin
在怪异模式下盒模型下，盒子总宽度和高度是包含内边距padding和边框border宽度在内
。
盒子总宽度/高度=width/height + margin = 内容区宽度/高度 + padding + border + margin;
box-sizing有两个值一个是content-box，另一个是border-box。
当设置为box-sizing:content-box时，将采取标准模式解析计算；
当设置为box-sizing:border-box时，将采取怪异模式解析计算。
hack?
(1) 图片间隙 
在div中插入图片，图片会将div下方撑大3px。
hack1：将<div>和<img>写在同一行。
hack2：给<img>添加display：block；
dt li 中图片间隙。
hack：给<img>添加display：block；
(2) 默认高度，IE6以下版本中，部分块元素，拥有默认高度（低于18px）
hack1：给元素添加：font-size：0；
hack2：申明：overflow：hidden；
表单行高不一致
hack：给表单添加申明：float：left；height：；border： 0；
鼠标指针
hack：若统一某一元素鼠标指针为手型：cursor：pointer；
当li内a转化块元素时，给a设置float，IE里面会出现阶梯状
hack1：给a加display：inline-block；
hack2：给li加float：left；
5. :before 和 ::before 区分?
单冒号(:)用于CSS3伪类，
双冒号(::)用于CSS3伪元素。
对于CSS2之前已经有伪元素，比如:before，单冒号和双冒号写法::before作用是一样。
上下左右居中?
答：有三种方法。
方法1：
.div1{ width:400px;
height:400px;
border:#CCC 1px solid;
background:#99f;
position:absolute; left:50%; top:50%;
transform: translate(-50%,-50%); }
<div class="div1"></div>
方法2：
.div2{ width:400px;
height:400px;
border:#CCC 1px solid;
background:#99f;
position: absolute; left:0; top: 0; bottom: 0; right: 0; margin: auto; }
<div class="div2"></div>
方法3：
.div3{ width:400px;
height:400px;
border:#CCC 1px solid;
background:#9f9;
position: absolute; left: 50%; top:50%;
margin-left:-200px;
margin-top: -200px; }
<div class="div3"></div>