浅谈块级元素的水平格式化细节

  1. 内边距不能为负值,而外边距能够为负(测试极限)无极限,设置为负的内边距都会默认改成0
  2. 盒子的width值并不会随着增长的padding margin而改变,它并非可见的值,每每在内容区左右添加边距,会隐式的增长width值。
  3. 水平格式化的七个属性:margin-left、border-left、width、border-right、margin-right,这些属性的值加起来正好是包含块也就是父盒子的width,所谓元素框与父元素的width相同。
  4. width、margin-left、margin-right 能够设置为auto 其余几个不能够。1.三个中有auto,则相对父盒子width尽量铺满,外边距为0。2.width为auto,一个外边距为auto,另外一个固定,则设置为auto的外边距减为0。3.若都设置固定值(称为格式化属性过度受限),则强制使margin-right为auto,做为从左向右读的语言(英语),会把右侧margin-right忽略掉
  5. 由此而来的居中,显示设置width值,外边距自动,盒子在父元素中居中,而text-align:center则只能用于块级元素的内联内容测试

  6. 外边距能够为负值,这项设定是有意义的,元素7个属性的总和不能比其包容块的width更大,可是都是固定值,且超过了父元素的width,那么会发生什么?
      • 左边margin正常,右侧margin又被和谐了
相关文章
相关标签/搜索