一个div分为边界,框边,还有内部,内部有内容到边框的距离padding
marigin符合样式
margin-top;
margin-right;
margin-top;
maigin-bottom;
注:可取负值。
padding符合样式
padding-top;
padding-right;
padding-bottom;
padding-left;
//style.css
#first{
width:200px;
height:100px;
background:green;
margin:20px;
float:left;
}
#second{
width:100px;
height:150px;
background:blue;
border:30px red solid;
padding-left:20px;
padding-top:30px;
float:left;
}
<html>
<head>
<title>div盒子模型</title>
<link rel = "stylesheet" href = "style.css" type = "css/style.css"/>
</head>
<body>
<div id="first">这是一个div</div>
<div id="second">这是另一个咯</div>
</body>
</html>