解開謎題:為什麼輸入元素缺少::before 和::after 偽元素
努力增強預設樣式HTML5 輸入元素中,一個常見問題是::after 偽元素無法呈現內容。儘管在各種瀏覽器上進行了多次嘗試和測試,但所需的視覺增強效果仍然難以捉摸。
這種奇怪的行為激發了人們的好奇心:為什麼瀏覽器一致忽略輸入元素上的 ::after 偽元素?對 CSS 規範的徹底檢查揭示了一個關鍵細節。根據 CSS21 規範,::after 僅適用於擁有文檔樹內容的元素。輸入元素以及圖像、換行等元素不包含此類內容,導致 ::after 的使用無效。
因此,答案在於輸入元素的本質。與攜帶文字內容的段落或跨度等元素不同,輸入元素主要促進使用者互動並且缺乏用於顯示目的的內容。這種固有的特性阻止了在輸入元素上使用 ::before 和 ::after 偽元素。
以上是為什麼輸入元素不支援 ::before 和 ::after 偽元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!