使用calc（）和供應商擴展的W3C CSS驗證錯誤

Question

完成新的HTML5 / CSS3模板后，我進入了W3C驗證。

HTML的結果：“此文檔已成功檢查為HTML5！”

CSS的結果：“對不起！我們發現以下錯誤（1）”

問題就在height: calc(100vh - 80px);附近height: calc(100vh - 80px);

它還告訴我：

36      Property -ms-transform is an unknown vendor extension
37      Property -webkit-transform is an unknown vendor extension
112     Property -webkit-transition is an unknown vendor extension
113     Property -moz-transition is an unknown vendor extension
249     Property -webkit-background-size is an unknown vendor extension
292     Property -webkit-background-size is an unknown vendor extension

那么在這種情況下，我該怎么做才能使其100％有效？

Answer 1

不用擔心供應商擴展。 我不記得為什么以這種方式標記它們，但它們並不是您的錯誤。 我不記得這樣做的原因。 iirc，有一個復選框可以忽略這些警告。

解釋可能在於本文中 ，其中指出：

供應商特定的擴展（大多數情況下）確實遵循CSS 2.1語法，但是由於CSS 2.1規范中未定義它們，因此它們無效。 因此，CSS驗證器在將其報告為驗證錯誤時是正確的。

Answer 2

在擔心賣方前綴之前，請先查看caniuse.com：

http://caniuse.com/#feat=calc

在這種情況下，可能是因為您不需要它們。 同樣基於w3規范。

http://www.w3.org/TR/css3-values/#calc

Answer 3

關於calc() ：

W3C CSS驗證程序在使用calc()時報告錯誤的事實是一個錯誤 ：

→ 從CSS3值支持calc（） （目前仍未修復）

關於供應商擴展：

它們的使用僅被列為警告 ，而不是錯誤 。

因此，即使使用供應商擴展，您的CSS仍然有效。