CSS自適應布局是指根據不同的設備大小和屏幕分辨率，自動適應不同的布局形式，以更好地適應不同的終端設備。下面是一份CSS自適應布局的代碼模板。

/* 定義基本樣式 */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* 定義通用容器 */
.container {
width: 90%; /* 寬度90% */
margin: 0 auto; /* 居中 */
max-width: 1200px; /* 最大寬度1200px */
}
/* 定義媒體查詢 */
@media (max-width: 768px) {
.container {
width: 100%; /* 寬度100% */
padding: 0 20px; /* 左右20px的內邊距 */
}
}
@media (max-width: 320px) {
.container {
max-width: 280px; /* 最大寬度280px */
}
}
/* 定義柵格系統 */
.row {
display: flex;
flex-wrap: wrap;
margin: 0 -15px; /* 左右-15px的外邊距 */
}
.col {
width: 100%;
padding: 0 15px; /* 左右15px的內邊距 */
}
@media (min-width: 768px) {
/* 小于等于768px的設備，col-6占50% */
.col-6 {
width: 50%;
}
}
@media (min-width: 992px) {
/* 小于等于992px的設備，col-6占33.33% */
.col-6 {
width: 33.33%;
}
}

以上代碼定義了基本樣式、通用容器和媒體查詢，還定義了柵格系統，可根據不同的設備進行布局調整，并支持多種分辨率設備的自適應布局，適用于不同類型的網頁開發。