知识卡片
栅格系统的负外边距抵消技巧
内容
Bootstrap栅格系统中,.row的左右外边距为-15px,.container与每一列的内边距为15px,二者相互抵消,使首尾两列贴齐容器边界、中间各列靠内边距形成间隔。这种”外层负margin+内层正padding”是浮动布局年代常见的留白手法;脱离栅格单独使用row时若忘记补回15px的padding,内容会溢出容器。
参考来源
《深入理解Bootstrap》第2章《整体架构》
知识卡片
Bootstrap栅格系统中,.row的左右外边距为-15px,.container与每一列的内边距为15px,二者相互抵消,使首尾两列贴齐容器边界、中间各列靠内边距形成间隔。这种”外层负margin+内层正padding”是浮动布局年代常见的留白手法;脱离栅格单独使用row时若忘记补回15px的padding,内容会溢出容器。