

代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
外边距:margin,自己不增加
内边距:padding,效果会是自己也增加,其实自己没变,但是由于是内部的
</style>
</head>
<body>
<div style="border: black solid;height: 100px">
<div style="background-color: red;height: 20px;padding-top: 28px"></div>
</div>
<div style="height: 200px"></div>
<div style="border: darkmagenta solid;height: 100px">
<div style="background-color: fuchsia;height: 20px;margin-top: 17px;"></div>
</div>
</body>
</html>
总结:
1、外边距:margin,自己不增加
2、内边距:padding,效果会是自己也增加,其实自己没变,但是由于是内部的
(都可以选择方向,如top)
网友评论