浏览器的盒子模型

  • IE盒模型
  • IE盒模型
  • w3c
  • W3C标准盒模型
  • 在(Quirks)模式下:
  • ie的盒子模型 
  • 盒模型占总空间=contentWidth
  • w3c盒子模型
  • 盒模型占总空间=contentWidth+padding+margin+border;
  • ff,chrome 都是W3C盒模型, 即总=contentWidth+padding+margin+border;
  • 如何解决这个bug
  • (1)通过头文件 设置页面的模式为标准模式:在标准模式下,ie6,7,8,9对盒子的渲染是:盒模型占总空间=contentWidth+padding+margin+border
  • (2)css3 中的box-sizing:border-box

     

原文地址:https://www.cnblogs.com/yanypan/p/3147917.html