1、若想上下DIV塊之間距離,只需設定:在CSS里設置DIV標簽各屬性參數為0
div{margin:0;border:0;padding:0;}
這里就設置了DIV標簽CSS屬性相當於初始化了DIV標簽CSS屬性,這里設置margin外邊距為0;邊框border屬性為0和內補白也為0;這樣相當於就初始化了DIV之間距各屬性距離為0,這樣就不會造成DIV直接有一定的距離。
2、如果想上下兩個DIV間有距離的話,只需設定div中的margin屬性即可,本例中div屬性對全局DIV塊都適用,代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<style type="text/css">
<!--設置DIV塊的邊界為5px-->
div{margin:5px;border:0;padding:0;}
#Box1{
width:200px;
height:72px;
background-color:#666;
}
#Box2{
width:200px;
height:72px;
background-color:#F0F;
}
</style>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>讓上下兩個DIV塊之間有一定距離或沒有距離</title>
</head>
<body>
<div id="Box1"></div>
<div id="Box2"></div>
</body>
</html>
這里設置了DIV塊的邊界為5px,當有上下兩個DIV塊時,邊界是重合的,按大的來,所以這里上下兩個DIV塊的距離是5px(只取其中大的邊界值,此處全局設定都是5px)
效果圖:
如不想全局設置DIV塊之間的邊界,可在各個DIV塊之間進行單獨設置margin。