1-7margin 外边距
<!doctype html>
<html>
<head>
<title>抬头</title>
<meta charset="utf-8">
<style>
.InternalStyle1
{
width:300px;
height:300px;
background:green center bottom no-repeat url("dragon.png");
border: purple 30px solid;
padding-top: 100px;
margin-bottom: 30px;//外边距
}
.InternalStyle2
{
width:300px;
height:300px;
background:orange center bottom no-repeat url("dragon.png");
border: brown 60px solid;
padding-top: 100px;
margin-top: 60px;//外边句会叠加，注意InternalStyle1与InternalStyle2放在一起时只有60px（最大）的边距，而不是相加后的90px
//margin:top right bottom left;//复合写法
//margin:top/bottom right/left;
}
</style>
<link href = "main.css" rel = "stylesheet">
</head>
<body>
<div class = "InternalStyle1">Internal Style1 内部样式1</div>
<div class = "InternalStyle2">Internal Style2 内部样式2</div>
<div class = "InternalStyle2">
边距传递
<div class = "InternalStyle1">
边距传递：父子级包含时，子级的margin－top会传递给父级。
</div>
</div>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
