CSS伸縮布局是一種靈活的方式，讓網(wǎng)頁中的元素能夠自適應(yīng)不同的屏幕大小和設(shè)備類型。伸縮布局依賴于CSS3的新特性，使用樣式表中的flex屬性來控制元素在容器中的布局。

下面我們來看一下如何實(shí)現(xiàn)CSS伸縮布局：

.container{
display: flex; /*這里是將容器的display屬性設(shè)置為flex*/
justify-content: center; /*這里是設(shè)置子元素在容器中水平居中*/
align-items: center; /*這里是設(shè)置子元素在容器中垂直居中*/
}
.item{
width: 200px; /*這里是將子元素的寬度設(shè)置為200像素*/
height: 100px; /*這里是將子元素的高度設(shè)置為100像素*/
margin: 10px; /*這里是將子元素的間距設(shè)置為10像素*/
}

以上代碼將會(huì)創(chuàng)建一個(gè)包括多個(gè)子元素的容器，這些子元素會(huì)根據(jù)容器的大小和方向進(jìn)行伸縮。通過設(shè)置容器的display屬性為flex，我們創(chuàng)建了一個(gè)伸縮容器，而justify-content和align-items屬性則幫助我們對(duì)子元素進(jìn)行水平和垂直的居中對(duì)齊。另外，我們還設(shè)置了子元素的寬度、高度和間距，讓它們?cè)谌萜髦杏幸欢ǖ拇笮『烷g隔。

在實(shí)現(xiàn)CSS伸縮布局中，我們還可以使用其他的樣式屬性，如flex-direction、flex-wrap、flex-grow和flex-shrink等，來進(jìn)一步控制容器和子元素的伸縮行為。在實(shí)際應(yīng)用中，我們可以根據(jù)不同的需求進(jìn)行靈活的調(diào)整，以滿足不同設(shè)備和屏幕的要求，讓網(wǎng)頁內(nèi)容展示更加美觀和適用。