CSS 偽元素
CSS 偽元素模組定義了不直接存在於文件樹中的抽象元素。這些抽象元素，稱為偽元素，代表了渲染樹中可以被選中和樣式化的部分。偽元素用於建立超出文件樹所提供的文件樹抽象。
偽元素以雙冒號 (::) 為字首。您將偽元素新增到選擇器（例如 p::first-line）中，以定位和樣式化這些假元素。
偽元素能夠定位不包含在 HTML 中的實體，以及如果不新增額外的標記就無法以其他方式定位的內容部分。考慮一個 <input> 元素的佔位符。這是一個抽象元素，而不是文件樹中一個獨立的節點。您可以使用 ::placeholder 偽元素來選擇此佔位符。再舉一個例子，::selection 偽元素匹配使用者當前高亮顯示的內容，允許您在使用者與內容互動並更改選擇時樣式化匹配的內容。類似地，::first-line 偽元素定位元素的第一個文字行，如果第一個文字行的字元數發生變化，它會自動更新，而無需查詢元素的行長。
參考
選擇器
::after::before::file-selector-button::first-letter::first-line::grammar-error::highlight()::marker::placeholder::selection::spelling-error::target-text
該規範還定義了 ::details-content 和 ::search-text 偽元素以及 ::postfix 和 ::prefix 子偽元素。這些尚未被任何瀏覽器支援。::highlight() 偽元素包含在此模組中，但大多數詳細資訊在 CSS 自定義高亮 API 中提供。
介面
術語
- 偽元素術語表
指南
- CSS 偽元素
-
所有 CSS 規範和 WebVTT 定義的偽元素按字母順序排列的列表。
- 學習：偽類與偽元素
-
選擇器部分中 CSS 構建塊的一部分。本文定義了什麼是偽元素以及如何將其與偽類結合使用，並用於使用
::before和::after偽元素生成內容。 - 如何使用偽元素建立花式盒子
-
使用
::before和::after偽元素為視覺效果樣式化生成內容的示例。
相關概念
::backdrop-
Web 影片文字軌道格式 (WebVTT) 提示
-
CSS 多列布局模組
-
CSS overflow 模組
-
CSS 作用域模組
-
CSS 陰影部分模組
-
CSS 檢視轉換模組
-
<input>元素的placeholder屬性
規範
| 規範 |
|---|
| CSS 偽元素模組 Level 4 |
另見
- 優先順序
- CSS 選擇器模組
- CSS shadow-parts 模組
- CSS 生成內容模組
- CSS 定位佈局模組
- CSS 自定義高亮 API