CSS是前端開發中非常重要的一種技術，它不僅可以實現網頁布局、樣式等等功能，還可以對網頁進行響應式設計，使得網頁可以在不同大小的屏幕上呈現出不同的布局和樣式。

/* 大屏幕樣式 */
@media screen and (min-width: 1200px) {
/* 樣式代碼 */
}
/* 中等屏幕樣式 */
@media screen and (min-width: 768px) and (max-width: 1199px) {
/* 樣式代碼 */
}
/* 小屏幕樣式 */
@media screen and (max-width: 767px) {
/* 樣式代碼 */
}

在上面的代碼中，我們可以看到通過媒體查詢來實現了不同屏幕尺寸下的不同樣式。當屏幕寬度大于等于1200px時，我們將應用大屏幕樣式；當屏幕寬度在768px和1199px之間時，我們將應用中等屏幕樣式，同時限制了樣式的最大值；當屏幕寬度小于等于767px時，我們將應用小屏幕樣式。

通過這種方式來設計響應式布局和樣式，我們可以讓網頁在不同設備上擁有更好的用戶體驗，同時也方便了網頁的開發和維護。