首頁 > web前端 > css教學 > 為什麼我無法使用逗號分隔選擇器組合 CSS 中特定於供應商的偽元素和類別?

為什麼我無法使用逗號分隔選擇器組合 CSS 中特定於供應商的偽元素和類別?

Patricia Arquette
發布: 2024-12-24 03:28:13
原創
416 人瀏覽過

Why Can't I Combine Vendor-Specific Pseudo-elements and Classes in CSS Using Comma Separated Selectors?

為什麼供應商特定的偽元素和類別不能組合

儘管使用逗號分隔的選擇器將相同的樣式應用於多個元素很方便,但這種方法不能應用於特定於供應商的偽元素和類別。這種不一致是由 CSS2.1 中概述的基本規則引起的。

CSS2.1 規格

CSS2.1 規格規定,任何無法被使用者代理程式解析的選擇器都必須被忽略及其對應的宣告區塊。這適用於偽類和偽元素選擇器中無法識別的供應商前綴。

瀏覽器解析

由於不同的瀏覽器使用不同的前綴,某些用戶代理將無法解析偽元素和類別帶有無法識別的前綴。因此,這些瀏覽器必須刪除包含這些無法識別的前綴的任何規則,從而導致需要重複聲明。

範例

考慮以下程式碼片段,其目的是使用特定於供應商的佔位符文字樣式選擇器:

嘗試使用逗號組合這些規則將導致在:

但是,這個組合規則集將會失敗,因為:

  • 使用webkit 的瀏覽器(例如​​ Safari)無法解析 :-moz-* 前綴。
  • 使用 gecko 的瀏覽器(例如​​ Firefox)無法解析 :-ms- 和:-webkit- 前綴。
  • 使用 Edge 的瀏覽器(例如​​ Internet Explorer)無法解析 :-webkit- 和 :-moz- 前綴。

結論

由於瀏覽器解析限制,無法結合特定於供應商的偽元素和類別放入單一逗號分隔的選擇器中。這導致在不同瀏覽器中設定元素樣式時需要重複聲明。

以上是為什麼我無法使用逗號分隔選擇器組合 CSS 中特定於供應商的偽元素和類別?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板