沒有指定寬度的浮動塊元素

Question

我正在讀這本書頭第一個HTML和CSS並且那裏寫的是任何浮動元素的要求是它必須有一個寬度。我試圖在沒有指定寬度的情況下對div元素進行浮動，並且float屬性起作用（儘可能地將div向右移動）。這是否意味着書中有錯誤，或者是我錯過了什麼？

Answer 1

是的，您可以在浮動元素中沒有width值在級聯中聲明。然後，通過defaulting進程，指定的值將是initial value。對於width，初始值爲auto。

CSS說明何時floated non-replaced element具有width: auto會發生什麼：

如果width被計算爲auto，所使用的值是 「收縮到合適」的寬度。

計算縮到適合寬度與使用自動錶格佈局算法計算表格單元的寬度相似。 大致爲：通過格式化內容 而不斷裂比顯式換行符發生在哪裏， 其他線路計算優選的寬度，並且還計算出優選最小寬度，例如，通過嘗試所有可能的 換行符。 CSS 2.1沒有定義確切的算法。 第三，找到可用寬度：在這種情況下，這是 寬度包含塊減去margin-left所使用的值， border-left-width，padding-left，padding-right， border-right-width，margin-right，以及任何相關的 滾動的寬度酒吧。

然後收縮以適應的寬度是：

min(max(preferred minimum width, available width), preferred width) 

的「收縮到配合」算法現在被稱爲fit-content measure。

Answer 2

float:right是元素的簡單堆疊，從左到右直到線寬被填充，然後從上到下。就像寫英文報紙一樣。

float:left使用的東西像一個工具，它會佔據整個頁面，除非其寬度受到限制。這就是爲什麼必須指定width。