CSS是Web前端開發(fā)中不可或缺的一項技術(shù)，可以實現(xiàn)豐富的效果和布局。其中，響應(yīng)式布局可以讓網(wǎng)頁針對不同設(shè)備和分辨率做出自適應(yīng)的布局，充分適配各種終端，提升用戶體驗。

在CSS中，我們可以使用媒體查詢（Media Query）來實現(xiàn)響應(yīng)式布局。媒體查詢是一種將樣式應(yīng)用于特定設(shè)備或媒體類型的條件語句。

/* 對于寬度大于等于768px的設(shè)備，應(yīng)用這段樣式 */
@media screen and (min-width: 768px) {
.container {
width: 750px;
margin: 0 auto;
}
}
/* 對于寬度小于768px的設(shè)備，應(yīng)用這段樣式 */
@media screen and (max-width: 767px) {
.container {
width: 100%;
padding: 0 10px;
}
}

在上面的代碼中，我們使用@media來聲明媒體查詢，然后設(shè)定需要應(yīng)用樣式的條件，這里我們以屏幕寬度為條件，分別設(shè)置大于等于768px和小于768px時的樣式。

大尺寸屏幕下，我們設(shè)定一個固定寬度，讓容器居中顯示，使得內(nèi)容看上去更加整齊美觀。小尺寸屏幕下，我們將容器寬度設(shè)為100%，并且給左右各加上10px的邊距，以避免內(nèi)容過于擁擠，同時也是為了適配手機和平板等媒體設(shè)備。

這樣，我們就可以輕松實現(xiàn)一個簡單的響應(yīng)式布局了。當(dāng)然，還有很多其他的CSS屬性和技巧，可以用來優(yōu)化響應(yīng)式布局，例如彈性盒子布局（Flexbox）、網(wǎng)格布局（Grid）、圖片響應(yīng)式處理、字體大小和行高的自適應(yīng)等等。不同的項目需求各不相同，我們需要結(jié)合具體情況來選擇最合適的方法。