css记录

标签：底部   col   tom   最小   border   img   class   消失   宽度   

padding

padding-top是在绿色边框内，从顶部向下移20像素位置，默认padding-top 为0时，红色边框为20像素高，通过padding-top属性，为顶部增加了20像素，这时顶部为40像素高，最小为0，负数无效，因为他是内边距属性

padding-bottom:20px为底部向下增加20像素，通过调试工具可以看到颜色重合这部分则为增加的内边距,bottom向下增加底部边距上限非常大，3.35544e+7px

padding-left:20px 为从左边开始向右增加20px ，最小为0px，3.35544e+7px为上限

padding-right:20px为从右向左增加20px,最小为0px，3.35544e+7px为上限

1  <div style="background-color: green;height: 100px;">
2         
3         <div style="height: 20px;background-color: red;padding-top: 20px">
4 
5         </div>
6     </div>

1 <div style="height: 20px;background-color: #9B1C2E;padding: 20px">

如果只写padding

则会在红色框，会从上，右，下，左顺序在各边增加20像素

margin

margin-top：为向上及绿色边框上边框开始再向上增加20px像素，当减小到一定像素，这个绿色边框将会消失,最大增加上限3.35544e+7px

1 <div style="height: 20px;background-color: red;margin-top: 20px">

如果为边框增加border:1px 属性，那么改为margin-left,则是在绿色边框内，将红色内边框从左向右缩20像素，最大为绿色边框宽度,

margin-right则将红色内边框从右向左缩20像素

margin-bottom将红色内边框底部向绿色边框底部增加

css记录

标签：底部   col   tom   最小   border   img   class   消失   宽度   

原文地址：https://www.cnblogs.com/dusihan/p/10131847.html