关于margin
margin四个方向正负表现
1、margin-top和margin-left是按照正常思维表现的 +则往下(往右)移,-则往上(往左)移{就是自己动}。
2、margin-bottom和margin-right是非正常的思维{自己不动,让人家动}或者说 +的时候用力推人家远离自己;- 的时候就使劲拉人家靠近自己。
正的时候 | 负的时候 |
---|---|
![]() | ![]() |
上下左右margin是否重合
1、如果两个盒子都同时存在margin-right和margin-left,margin不会。但是margin-top和margin-bottom如果同时存在,则margin的距离会重合(同级之间)。
左右margin |
---|
![]() |
2、如果父级没有overflow:hidden;或者没有设置border的话。并且子级有外边距的话,那么就会出现上下外边距(越狱),并且margin会重合。
上下外边距重合 | 外边距越狱 |
---|---|
![]() | ![]() |