css总结9：内边距（padding）和外边距（margin）

1 css总结9：内边距和外边距

通过css总结8：盒子模型可知：内边距（padding），外边距（margin）。可以影响盒子在浏览器的位置。

1.1 padding使用：{padding：上 右 下 左}

 示例：div {padding: 50px 10px 20px 30px} - 上内边距是 50px，右内边距是 10px，下内边距是 20px，左内边距是 30px

常用单位：

padding-bottom: 50%;--相对于父元素宽度的百分比内边距。

左 padding-left: 20px;
右 padding-right: 30px;
上 padding-top: 40px;
下 padding-bottom: 50px;

1.2 margin使用：{margin：上 右 下 左}

　示例：div {margin: 50px 10px 20px 30px} - 上外边距是 50px，右外边距是 10px，下外边距是 20px，左外边距是 30px。

 常用单位：

margin：auto；---浏览器自动计算外边距。

margin：50%；---规定基于父元素的宽度的百分比的外边距。