简述 Javascript 盒子模型?
在 Web 开发中，CSS 盒模型是用来布局和设计的基本概念。在 CSS 盒模型中，每个元素都被视为一个矩形的盒子，这个盒子具有宽度、高度、边距、填充和边框。
盒模型主要包含四个部分：
- 内容（Content）： 这是盒子里面的实际内容，如文本、图片等。其尺寸可以通过
width和height属性来设置。 -
内边距（Padding）： 内边距是内容周围的空白区域，它清晰地隔离了内容和边框。内边距的大小可以通过
padding属性来设置。 -
边框（Border）： 边框就像是盒子的外壳，它包围了内容和内边距。边框的大小和样式可以通过
border属性来设置。 -
外边距（Margin）： 外边距是盒子和其他元素之间的空白区域。它在边框的外面，用来隔离盒子和其他元素。外边距的大小可以通过
margin属性来设置。
在 CSS 中，盒模型有两种：标准盒模型和IE盒模型。
- 标准盒模型： 在这个模型中，
width和height指的是内容区的宽度和高度，而不包括内边距、边框和外边距。总的盒子大小计算公式为：总宽度 = width + padding-left + padding-right + border-left + border-right + margin-left + margin-right，高度同理。 -
IE盒模型： 在这个模型中，
width和height指的是内容区、内边距和边框的总宽度和高度。外边距不包括在内。总的盒子大小计算公式为：总宽度 = width + margin-left + margin-right，高度同理。
可以使用 CSS 的 box-sizing 属性来选择使用哪种盒模型，content-box 为标准盒模型，border-box 为IE盒模型。