CSS盒子模型——标准模型和IE模型的区别,如何设置标准模型、IE模型

区别:
两者区别在于content不同
标准盒模型是content不包括padding border
IE盒模型是content包括padding border

标准盒模型


20200306155814380.png

标准盒模型content=content (元素的宽度和高度是content)

IE盒模型


20200306155638944.png

ie盒模型的content=content+padding+border (元素的宽度和高度是content+padding+border)

设置IE和标准的属性

box-sizing: border-box; // 设置IE模型 也称怪异模式
box-sizing: content-box; // 设置标准模型 (默认属性)
box-sizing: padding-box; // padding计算入width
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容