CSS中的盒子模型是用來(lái)描述HTML元素大小和位置的基本模型。默認(rèn)情況下，CSS采用的是標(biāo)準(zhǔn)的盒子模型，它的大小指的是元素的內(nèi)容區(qū)域大小（不包括border和padding）。在CSS中，可以通過(guò)設(shè)置box-sizing屬性來(lái)改變盒子模型的計(jì)算方式。

/* 默認(rèn)盒子模型 */
div{
width: 200px;
height: 100px;
border: 1px solid #000; /* border占據(jù)了width和height的空間 */
padding: 10px; /* padding也占據(jù)了width和height的空間 */
margin: 20px;
}
/* 改變盒子模型為border-box */
div{
box-sizing: border-box;
width: 200px;
height: 100px;
border: 1px solid #000; /* border和padding占據(jù)了width和height的空間 */
padding: 10px;
margin: 20px;
}

在默認(rèn)盒子模型中，元素的大小計(jì)算公式為：width/height = 內(nèi)容區(qū)域大小 + padding + border。如果不考慮box-sizing的影響，那么給元素設(shè)置width和height屬性時(shí)，實(shí)際展現(xiàn)的大小會(huì)比設(shè)置的值要大。因此，在實(shí)際開(kāi)發(fā)中，需要考慮盒子模型的計(jì)算方式來(lái)避免出現(xiàn)不必要的問(wèn)題。