Q：當 CSS 屬性在 Quirks 模式瀏覽器中缺少單位時會發生什麼？

沒有單位的 CSS 屬性：回退到 PX

在 CSS 中，從屬性值中省略單位似乎很方便。但是，這樣做可能會導致意外的回退情況。在怪異模式下，瀏覽器在遇到無單位屬性時可能表現不一致。本文研究了回退行為、其意義以及跨瀏覽器的不一致。

回退到PX

當CSS 屬性缺少單位（例如“px”）時， “em”或“%”，瀏覽器可能預設為後備單位。在怪異模式下，許多瀏覽器選擇“px”作為後備單位。此行為與接受像素長度為無單位值的舊版 HTML 屬性一致。

但是，此行為在不同瀏覽器中並不一致。某些瀏覽器（例如​​標準模式下的 Internet Explorer 7 及更高版本）會忽略缺少單位的規則屬性，而其他瀏覽器（例如​​ Chrome、Firefox 和 Safari）則繼續回退到「px」。

W3C 規範

CSS 的 W3C 規範規定所有非零長度值必須有單位。因此，無單位屬性無效。本規範適用於標準模式渲染。在怪異模式下，瀏覽器可以更自由地實現怪異行為，這可以解釋回退行為的變化。

強制回退規則

沒有強制執行的特定規則瀏覽器回退到首選單位。此決定由瀏覽器自行決定，並可能根據瀏覽器版本、渲染模式和涉及的特定屬性而有所不同。

範例行為

網路Explorer 在怪異模式和標準模式下的行為有所不同。在怪異模式下，它用於將寬度和邊框寬度回退到“px”。但是，在標準模式下，它會忽略缺少單位的屬性規則。

Firefox 與 Internet Explorer 的不同之處在於怪異模式。它將寬度回落到“px”，但忽略邊框寬度屬性。 Chrome、Opera 和 Safari 在怪異模式下都將 width 和 border-width 回退為「px」。

結論

不鼓勵在 CSS 中使用無單位屬性。它可能會導致意外結果和瀏覽器不一致，尤其是在怪異模式下。遵守為所有長度值指定單位的 W3C 建議將確保跨瀏覽器的一致渲染。

以上是Q：當 CSS 屬性在 Quirks 模式瀏覽器中缺少單位時會發生什麼？的詳細內容。更多資訊請關注PHP中文網其他相關文章！