CSS方框選項中的浮動（float）是一種很常見的布局方式，可以讓元素從文檔的正常流中脫離出來，向左或向右浮動，周圍的元素會自動重新排布。
使用浮動可以實現多列布局、圖片與文字的混排等效果。下面我們來演示一個簡單的浮動布局。
首先，在CSS中使用float屬性時，需要將元素的display屬性設置為block或inline-block，否則浮動不起作用。在本例中，我們設置一個div容器的寬度為300px，高度為200px，背景色為灰色，使其能夠包含幾個浮動元素。代碼如下：

div {
width: 300px;
height: 200px;
background-color: #ccc;
}

然后，在這個div中嵌套三個p元素，分別設置不同的寬度和高度，并使用float屬性將它們向左浮動。代碼如下：

<p style="width: 100px; height: 100px; background-color: red; float: left;"></p>
<p style="width: 50px; height: 50px; background-color: green; float: left;"></p>
<p style="width: 150px; height: 150px; background-color: blue; float: left;"></p>

這樣，我們就創建了一個包含三個浮動元素的簡單布局。可以看到，左側和上方的空白區域是由于浮動元素脫離正常流導致的。
需要注意的是，使用浮動布局時，需要考慮元素間的距離和間隙，以及浮動元素的高度和寬度。如果浮動元素高度不同，可能會導致周圍元素的排布出現異常。
總的來說，CSS方框選項中的浮動是一個很強大的布局方式，可以實現多種復雜的頁面布局效果，但同時也需要注意代碼的書寫順序和細節處理，才能達到預期的效果。