总是忘记一些常用的前端技巧，有这个帖子记录一下吧：
1.让ul 中的li 横布局排列，并且没有浮点：ul li{ folat:left; list-style:none}
2.li标签之间的间距：margin-right:5px;
3.z-index:主要用于上下层叠，比如想让一个div覆盖在另一个div上就将上面那个设置成z-index:2。 此元素做成蒙板的特效常与opacity: 属性联用，将底下那一层div制作成透明的效果。
4.top：和left：需与绝对定位position：absolute联用。根据调整top和left的值来调整div的位置。详情可参照以下代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS布局</title>
<style type="text/css">
*{
margin: 0;
padding:0;
}
.layer{
position:absolute;
width:100%;
height:500px;
}
.layer img{
width: 380px;
height: 240px;
opacity: 0.9;
width:100%;
height:300px;
}
.layertop{
position:absolute;
z-index:2;
background:crimson;
top:140px;
left:350px;
}
</style>
</head>
<body>
<nav>
</nav>
<div class="layer">
<img src="http://climg.mukewang.com/58f829ca00010be703840240.jpg">
</div>
<div class="layertop">
文字的效果
</div>
</body>
</html>5.让三个默认竖排显示的div变成横排三个排列：给三个div设置左浮动，并且给宽度。
6.如果上面一个div使用了浮动效果会导致下面一个div的padding top失效，为了清除float带来的负面效果，可以使用一个空div
<div class=clear></div> 并且给他设置一个.clear{clear:both}的样式。