通过css的padding来定义内边距
-
padding的取值最多可以为4个如，padding: 100px 80px 50px 20px;
-
padding的4个参数分别代表上、右、下、左四个方向的内边距
-
1个参数，padding：100px，指4个方向内边距均为100px
-
2个参数，padding：100px 20px，指上下内边距为100px，左右内边距20px
-
3个参数，padding：100px 20px 5px，上100px，左右20px，下5px
-
可以看出，如果没定义下边距，则下边距默认等于上边距，如果没有定义左边距，则默认左边距等于右边距
.b{
padding: 100px 50px 20px 10px;
}
单边内边距属性
我们也可以单独设置4个方向的内边距
-
padding-top
-
padding-right
-
padding-bottom
-
padding-left
内边距的百分比数值
内边距不只可以以像素为单位，也支持其它单位，当以百分比为单位时，百分数值是相对于其父元素的 width 计算的。
如下，b是a的父元素，a的padding为10%，即为父元素b的宽度500px＊10%＝50px
<style>
.b{
width: 500px;
height: 600px;
background-color: red;
}
.a{
width: 100px;
height: 100px;
padding: 10%;
background-color: blue;
color: white;
}
</style>
<div class="b">
<div class="a">
内容从这里开始
</div>
</div>
