文章為csslint中文版譯文，點擊原文可查看英文版，如遇到翻譯錯誤或錯別字啥的，請留言指出~ 譯文內容不定期更新~ 返回目錄
游覽器前綴屬性是 各游覽器提供商在標準樣式還未建成時,提供實驗性 新增CSS功能,而創建的。其允許開發者和游覽器提供商在之后 新增屬性還未確定定稿時,發現潛在的缺陷和跨游覽器兼容性問題。標準版屬性通常(但也不總是)與游覽器前綴版,有著相同的名字和語構,如果有兩種或以上相同的游覽器前綴屬性 語構相似,則標準版屬性與其語構保持一致。
當使用游覽器前綴屬性 如-moz-border-radius,你應當同時編寫標準屬性,以保障今后的兼容性。標準屬性編寫應在 游覽器前綴屬性之后,以確保 標準屬性能被游覽器識別使用到,如下:
.mybox {
-moz-border-radius: 5px;
border-radius: 5px;
}
將標準屬性放置游覽器前綴屬性之后 是確保一旦標準屬性完全實行時,你的CSS代碼能正常運轉的最好方式(接著,你就可找個喝茶的時間,把以往的游覽器前綴屬性給刪除)。
規則詳情
規則 ID: vendor-prefix
此規則意在確保 不論何時使用游覽器前綴屬性時,與其匹配的標準屬性均同時編碼。因此,規則在以下條件時,提示警告:
- 游覽器前綴屬性之后,沒有跟隨與其匹配的標準屬性。
- 與游覽器前綴屬性匹配的標準屬性,出現在前綴屬性之前。
以下示例 提示警告:
/* missing standard property */
.mybox {
-moz-border-radius: 5px;
}
/* standard property should come after vendor-prefixed property */
.mybox {
border-radius: 5px;
-webkit-border-radius: 5px;
}
以下示例 不提示警告:
/* both vendor-prefix and standard property */
.mybox {
-moz-border-radius: 5px;
border-radius: 5px;
}
