在浏览器中，盒模型次要有两种：规范盒模型和IE盒模型。
- 规范盒模型：在规范盒模型中，元素的宽度和高度只包含 content 的大小，不包含 border 和 padding。
- IE盒模型：在IE盒模型中，元素的宽度和高度包含 content、padding 和 border。
对于应用规范盒模型的元素，能够通过设置 width 和 height 属性来管制 content 的大小，而 padding 和 border 则会减少元素的总宽度和高度。例如：
div { width: 200px; /* content 宽度为200px */ height: 100px; /* content 高度为100px */ padding: 20px; /* 上下左右的 padding 均为20px */ border: 1px solid black; /* 边框为1px彩色实线 */}对于应用IE盒模型的元素，能够通过设置 width 属性来管制 content、padding 和 border 的总宽度，而 height 则管制了 content、padding 和 border 的总高度。例如：
div { width: 200px; /* 内容宽度为200px，但总宽度应为 content + padding + border = 200 + 2*20 + 2*1 = 242px */ height: 100px; /* 内容高度为100px，但总高度应为 content + padding + border = 100 + 2*20 + 2*1 = 142px */ padding: 20px; /* 上下左右的 padding 均为20px */ border: 1px solid black; /* 边框为1px彩色实线 */ box-sizing: border-box; /* 将盒模型设置为IE盒模型 */}总之，通过管制盒模型的属性，能够实现对元素的宽度、高度、内外边距和边框款式的管制。
antd框架应用的是CSS的盒子模型，包含了content、padding、border和margin等内容。而在默认状况下，antd组件的宽度应该是包含了padding的值的。这意味着，如果你设置一个antd组件的宽度为300px，那么元素内容的宽度可能会小于300px，因为该组件的padding值也占用了一部分空间。
如果你想要取得一个不蕴含padding的宽度值，能够应用box-sizing属性。box-sizing属性用于定义元素的盒模型，能够应用以下两种值之一：
- content-box：元素的宽度和高度仅包含元素内容的尺寸，不包含padding、border和margin。
- border-box：元素的宽度和高度包含元素内容、padding和border的尺寸，但不包含margin。
antd应用的是CSS的盒子模型，默认状况下宽度（width）和高度（height）属性指定的是content区域的尺寸。然而，antd的宽度包含padding和border，但不包含margin。这意味着如果你将一个antd组件的宽度设置为300px，实际上整个宽度可能会大于300px，因为padding和border的尺寸也会被计算在内。
例如，对于Input组件，如果您设置其宽度为300px，则元素理论的宽度可能会是300px + 左右padding值 + 左右border值。如果您须要包含所有盒子模型尺寸，能够应用CSS的box-sizing属性设置盒子模型的类型。能够设置如下两个属性值：
- content-box：内容框的尺寸利用于元素的宽度和高度。如果设置宽度为300px，那么其实只蕴含了元素的内容，不包含padding和border。
- border-box：整个盒子模型的尺寸利用于元素的宽度和高度。如果设置宽度为300px，那么整个盒子模型的尺寸，包含padding和border值，都将作为这个宽度的一部分。
在antd中，大多数组件的box-sizing属性值都是border-box。如果您想更改它们的box-sizing属性值，能够写自定义款式笼罩默认款式达到目标。