為什麼 CSS :after 偽元素不適用於所有 HTML 元素？

揭開 CSS :after 屬性的約束

CSS :after 偽元素在文件中的元素內容之後加入內容樹。然而，它的適用性卻引發了疑問。

元素限制

CSS 規範規定 :after 可以應用於元素樹內容之前或之後的內容，看似無限。然而，在實踐中，某些元素，例如圖像 ()、輸入 () 和表格 (

)，表現出不同的行為。

理解替換元素

理解這種行為的關鍵在於替換元素的概念。替換元素是那些外觀和尺寸由外部資源定義的元素，包括圖像、插件和表單元素。

:after 和替換元素

至關重要，CSS 規範明確規定 :before 和 :after 僅適用於非替換元素。 因此，替換元素就像一樣和不能有 :after 或 :before 屬性。

DOM 結構注意事項

當非替換元素使用:before 和:after 時，DOM 結構看起來像this:

span的內容

對於圖像等替換元素，此結構不可行，因此行為不一致。

以上是為什麼 CSS :after 偽元素不適用於所有 HTML 元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！