總是忘記一些常用的前端技巧，有這個帖子記錄一下吧：
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}的樣式。