eg:
<html>
<head>
<style>
html
{
border:2px solid blue;
}
body
{
border:2px solid red;
margin:100px;
padding:50px;
}
</style>
</head>
<body>
这里是文段
</body>
</html>
1.第一种情况:
body有margin,html没padding:
可以看到不管body的margin有多大,body与html边边相贴。
2.html有padding;
当html有padding时,会影响到body的大小,使body缩小。
html中被包含模块的margin不能改变包含模块的大小,但是却能影响到被包含模块在包含模块中的位置(html和body是个例外),只有包含模块自身有padding时才能改变自身的大小。
eg:
.one
{
border:2px solid blue;
}
.two
{
border:2px solid red;
margin:50px;
}
<div class="one">
<div class="two">
这里是文段
</div>
</div>