请简介 CSS 的盒模型

Issue 欢迎在 Gtihub Issue 中回答此问题: Issue 626 (opens in a new tab)

Author 回答者: linlai163 (opens in a new tab)

• 标准盒模型 width = content-width height = content-height
• 怪异盒模型 width = content-width + padding + border height = content-height + padding + border

但是我感觉怪异盒模型更好用 😂

Author 回答者: shfshanyue (opens in a new tab)

CSS 的盒模型主要包括以下两种，可通过 box-sizing (opens in a new tab) 属性进行配置：

• content-box：默认属性。width 只包含 content
• border-box：width 包含 (content、padding、border)