标准CSS盒子模型与IE盒子模型

盒子模型的概念说法有很多,个人的简单理解就是——即具备内容、填充、边框、边界这些属性的均可以看作盒子模型,无论是不是块级元素!

那么,主要的两种盒子模型:标准CSS盒子模型与IE盒子模型的区别是什么?(盗用两张图)

        标准盒子模型:元素的width或height=content的width或height;

      

       IE盒子模型:元素的width或height=content的width或height+padding*2+border*2;

      注意:这里所说的元素的width或height是指我们设置的元素的宽和高的大小!

标准盒模型与怪异盒模型相互转化:

box-sizing:border-box;//怪异盒模型

box-sizing:content-box;//标准盒模型

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,809评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,748评论 1 45
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,338评论 0 11
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,805评论 0 2
  • 不知道大家有没有想过女生为什么会跟男生吵架,敢于吵架的女生,除了有吵架的底气,无非就是想通过吵架确定两个问题。 第...
    女性能量分享阅读 907评论 5 6