编程技术

Document

浏览器/html/css面试题----1

1.什么是盒模型

盒模型

margin(外边距)- 清除边框外的区域，外边距是透明的。
border(边框)- 围绕在内边距和内容外的边框。
padding(内边距)- 清除内容周围的区域，内边距是透明的。
content(内容)- 盒子的内容，显示文本和图像。

W3C的标准盒模型

在这里插入图片描述

在标准的盒子模型中，width指content部分的宽度

IE的盒模型

在这里插入图片描述

在IE盒子模型中，width表示content+padding+border这三个部分的宽度

css如何设置两种模型

这里用到了CSS3 的属性 box-sizing

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

 /*IE模型*/
box-sizing:border-box;

</