老师，padding我理解上出现一些问题。
padding到底应该加在父级上还是子级上？
比如下面代码，加在了父级上：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.box{width: 200px;height: 200px; background-color: red; padding: 30px;}
.son{background-color: yellow;}
</style>
</head>
<body>
<div class="box">
<span class="son">占位文字</span>
</div>
</body>
</html>如果这么加，我理解为是父级对它的内容产生了padding，并且撑大父级自己。
下面代码加在了子级上，我理解为，是子级对内容文字产生padding，并把子级自己撑大了。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.box{width: 200px;height: 200px; background-color: red; }
.son{background-color: yellow;padding: 30px;}
</style>
</head>
<body>
<div class="box">
<span class="son">占位文字</span>
</div>
</body>
</html>那么通常我们再布局的时候需要让内容距离边框有距离，那么就把padding放在父级中就可以了，这么理解对吗？
34
收起
正在回答
2回答
div盒模型默认是content-box，在宽度和高度之外绘制元素的内边距和边框。也就是设置的padding会影响元素本来设置好的宽高。
相似问题
关于margin和padding使用出现的问题。。
11
0
3
学的有点懵，有些理解还有些问题想问老师
60
0
8
老师这一节后半段有些难懂，有几个问题想了解下。
26
0
3
老师有两个问题
22
1
5
登录后可查看更多问答，登录/注册
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的，首先得入门，学习基础知识，然后才能进阶，最后再到精通，本专题是你走进前端世界的不二选择！
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星