说说你对盒模型的理解， 浏览器怎么使用不同的

CSS 盒模型描述了以文档树中的元素而生成的矩形框，并根据排版模式进行布局。每个盒子都有一个内容区域（例如文本，图像等）以及周围可选的padding、border和margin区域。

 

CSS 盒模型负责计算：

• 块级元素占用多少空间。
• 边框是否重叠，边距是否合并。
• 盒子的尺寸。

盒模型有以下规则：

• 块级元素的大小由width、height、padding、border和margin决定。
• 如果没有指定height，则块级元素的高度等于其包含子元素的内容高度加上padding（除非有浮动元素，请参阅下文）。
• 如果没有指定width，则非浮动块级元素的宽度等于其父元素的宽度减去父元素的padding。
• 元素的height是由内容的height来计算的。
• 元素的width是由内容的width来计算的。
• 默认情况下，padding和border不是元素width和height的组成部分。

解析：参考