CSS布局是前端開發中的重要部分，它可以讓我們更好地控制頁面元素的位置和樣式。下面我們來介紹一些常見的CSS布局題目。

// 居中布局
.container {
display: flex;
justify-content: center;
align-items: center;
}
// 兩欄布局
.container {
display: flex;
}
.left {
flex: 1;
}
.right {
flex: 1;
}
// 三欄布局
.container {
display: flex;
}
.left {
flex: 1;
}
.center {
flex: 2;
}
.right {
flex: 1;
}
// 網格布局
.container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
}
.item {
grid-column: 1 / 4;
grid-row: 1 / 4;
}
// 響應式布局
@media screen and (max-width: 768px) {
.container {
display: flex;
flex-direction: column;
}
}

以上是幾個常見的CSS布局題目。需要注意的是，不同的布局方式適用于不同的頁面和場景。在實際開發中，我們需要根據實際情況來選擇最合適的布局方式。