在網頁設計中，垂直居中和自適應布局是兩個重要的方面。CSS可以幫助我們輕松地實現這些功能。下面是一些關于垂直居中和自適應布局的CSS代碼和示例：

/* 垂直居中 */
.parent {
display: flex; /* 將父元素設置為 flex 容器 */
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
}
/* 自適應布局 */
/* 媒體查詢 */
@media (min-width: 768px) { /* 當屏幕寬度大于等于 768px 時生效 */
.container {
width: 750px; /* 設定為固定寬度 */
margin: 0 auto; /* 水平居中 */
}
}
/* 移動設備 */
.container {
width: 100%; /* 寬度設為百分比 */
padding: 10px; /* 設定一個合適的內邊距 */
}

以上代碼中，垂直居中是通過設置父元素為flex容器，然后使用justify-content和align-items屬性實現的。自適應布局則是通過媒體查詢和百分比寬度實現的。在移動設備上，容器寬度為100%，在大屏幕上則設定為固定寬度并居中顯示。

總之，CSS的強大功能可以幫助我們實現各種網頁設計方案，包括垂直居中和自適應布局。希望以上代碼和示例可以幫助您更好地理解垂直居中和自適應布局的實現方法。