網頁的自適應是現代網頁設計中必不可少的一項功能，它可以讓網頁在不同的設備和屏幕大小下，適配不同的分辨率和設備屏幕，提高用戶體驗。實現網頁自適應的方式有很多種，其中使用CSS進行改變是一種比較簡單有效的方式。

@media screen and (max-width: 768px) {
/* 小于等于768px時樣式 */
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
/* 大于等于769px，小于等于1024px時樣式 */
}
@media screen and (min-width: 1025px) {
/* 大于等于1025px時樣式 */
}

以上代碼展示了如何使用CSS中的媒體查詢，根據不同的屏幕大小，自適應調整頁面元素樣式。在媒體查詢中，使用max-width和min-width屬性設置條件，當屏幕寬度小于等于某個值時，應用相應的樣式。

除了媒體查詢，還可以使用CSS3新特性-flex布局，幫助頁面更好的進行自適應。flex布局通過設置父容器的屬性來實現子元素的自適應排列，避免了傳統布局方式中需要使用float和clear等屬性來進行排列的不足。

.container {
display: flex;
}
.container div {
flex: 1;
}

以上代碼展示了使用flex布局進行子元素自適應排列的例子，通過在父容器上設置display:flex屬性，將子元素設置為相同的flex:1屬性，就可以實現自適應布局。

在進行網頁自適應的過程中，還需要考慮到多種因素，例如不同設備的屏幕大小、分辨率、屏幕方向等等，需要根據實際情況進行調整和優化，才能達到更好的效果。