css - absolute定位时top right bottom left全部为0;margin:auto;对margin的作用范围的疑问

问题描述

问 题

这个黄色区域就是.container的margin的作用范围
看右边的属性,当t r b l全部为0时 margin可以无限朝4个方向延伸,从而保持元素自己在正中央

当 r b l 为0,而没有写top时,又成了这样

当t r b为0时,又成了这样

问题是,为何margin在图2 图3的情况下,没有占据白色的区域呢?

解决方案

这个方法是把margin设为auto,正常情况margin是0。
当绝对定位时,为了满足l,r,b,t都为0，margin被拉伸而且上下左右相等所以居中。
当l=0被取消时，container直接位置右移就能满足r=0,并不需要拉伸margin,所以左右margin默认为0。

这篇关于css - absolute定位时top right bottom left全部为0;margin:auto;对margin的作用范围的疑问的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！