CSS 能夠非常方便地實(shí)現(xiàn)容器的寬度自適應(yīng)。實(shí)現(xiàn)容器自適應(yīng)的方式有很多種，這里介紹兩種常用的實(shí)現(xiàn)方法。

.container1 {
width: auto;
max-width: 1000px;
margin: 0 auto;
}

這是第一種實(shí)現(xiàn)方式，使用了 width 屬性和 max-width 屬性，width 屬性設(shè)置為 auto，意思是容器寬度會(huì)自動(dòng)根據(jù)內(nèi)容而改變，max-width 屬性則是用來(lái)限制容器寬度的最大值，來(lái)保證內(nèi)容合理排布。margin 屬性則是讓容器在頁(yè)面中居中。

.container2 {
display: flex;
flex-wrap: wrap;
}
.item {
flex-grow: 1;
}

這是第二種實(shí)現(xiàn)方式，通過(guò)使用 flex 布局的方式實(shí)現(xiàn)容器寬度自適應(yīng)。.container2 中設(shè)置了 display:flex 屬性，讓內(nèi)容在容器中 flexible 布局。flex-wrap:wrap 屬性則是在內(nèi)容超出容器寬度時(shí)換行。而 .item 則是內(nèi)容所在的容器，通過(guò)設(shè)置 flex-grow:1 屬性，讓其在容器中占據(jù)相同的空間。

這兩種方式各有優(yōu)缺點(diǎn)，具體應(yīng)該根據(jù)情況而定。以上兩種方式能夠輕松實(shí)現(xiàn)容器寬度自適應(yīng)，讓頁(yè)面更美觀、合理。