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%;---规定基于父元素的宽度的百分比的外边距。