在CSS中，有時(shí)候我們需要撐開一個(gè)盒子，使它占滿整個(gè)父元素，這時(shí)候我們可以通過(guò)設(shè)置盒子的寬度和高度為100%，并且設(shè)置盒子的邊框和內(nèi)邊距為0來(lái)實(shí)現(xiàn)。

.box {
width: 100%;
height: 100%;
border: 0;
padding: 0;
}

此時(shí)盒子已經(jīng)撐滿了父元素，但是如果盒子內(nèi)部有其他元素，可能會(huì)出現(xiàn)布局上的問(wèn)題，比如子元素不居中等。為了解決這個(gè)問(wèn)題，我們還需要設(shè)置盒子的display屬性為flex。

.box {
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
}

這樣子元素就能夠居中顯示了。如果還需要撐開盒子的背景圖或者顏色，可以設(shè)置背景填充屬性background。

.box {
background: #fff;
}

撐開盒子也可以使用絕對(duì)定位的方式，這時(shí)候需要給父元素設(shè)置相對(duì)定位，并且子元素設(shè)置絕對(duì)定位和top、right、bottom、left四個(gè)方向的距離都為0。

.parent {
position: relative;
}
.child {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}

以上就是CSS中撐開盒子的兩種方法，具體使用還需要根據(jù)實(shí)際情況選擇合適的方式。