CSS中的浮動和定位是頁面布局中非常重要的兩個屬性。浮動可以讓元素脫離文檔流，定位可以將元素精確定位到指定位置，兩者結合起來可以實現復雜的頁面布局效果。

/* 浮動屬性 */
div {
float: left;
}
/* 定位屬性 */
div {
position: absolute;
top: 100px;
left: 200px;
}

浮動屬性最為常用的是左右浮動，可以將元素放置在容器中的左側或右側。浮動后容器中的元素會自動填充浮動元素的位置。同時，浮動元素也可以實現多個元素并排放置的效果。

/* 左浮動 */
.left {
float: left;
}
/* 右浮動 */
.right {
float: right;
}

定位屬性分為相對定位和絕對定位兩種。相對定位是相對于元素本身原來所處的位置進行定位，而絕對定位則是相對于離它最近的已定位的父元素進行定位。

/* 相對定位 */
div {
position: relative;
top: 10px;
left: 20px;
}
/* 絕對定位 */
div {
position: absolute;
top: 100px;
left: 200px;
}

浮動和定位可以配合使用，比如可以使用浮動讓多個元素橫向排列，并將其中一個元素絕對定位到指定位置，實現特殊功能。總而言之，浮動和定位是實現復雜頁面布局的重要手段，合理運用可以達到出色的布局效果。