為什麼很多瀏覽器不直接支持原始的 CSS3 樣式,而要使用特定前綴(如 -webkit/-moz 等)呢?

例如 border-radius 這個樣式,瀏覽器在某一版本打算支持這個樣式,為什麼不直接支持,而要使用 -webkit-border-radius/-moz-border-radius 來支持?


今年w3c剛剛把css2.1升為推薦版,可想css3還遠著呢。

css標準中各個屬性也要經歷從草案(WD)到推薦(REC)的過程,css3中的屬性進展都不一樣。瀏覽器廠商在標準尚未明確情況下提前支持會有風險,同時也會出現有的瀏覽器廠商支持的好,有的支持的不好,所以就用廠商前綴加以區分。

PPK也建議如果已成為REC或接近REC的屬性,廠商如果完全實現了w3c的test case,就不用加廠商前綴,像border-radius在ie9下就不用加前綴。

可以在這裡了解css標準的進展: http://www.w3.org/Style/CSS/current-work


很多情況是由於廠商先實現,後入標準,廠商當時實現的私有前綴被廠商自己保留。


同意一樓,CSS3現在還是沒有達成一致的技術,具體不了解

給個相關例子,webkit和gecko實現漸變的方式就明顯不一樣

對應參數語法,,好像也不一樣,直接放到一起多半出問題

http://www.evansdiy.com/tips/css3+gradient


因為標準還沒有定下來,如果提前使用前綴會導致未來的不兼容。

這一點可以參考 IE6 中的display:inline-block問題,它在標準提到 inline-block 之前就使用了 inline-block 這個值,當標準後於實現提出 inline-block 並給出不一樣的含義時,這個問題就很難辦了。


盡量使用標準css3,不要為了兼容而兼容,過段時間都統一了,垃圾代碼就多了。


你可以使用一些js類庫或者工具來幫助你自動轉化css3屬性,不用寫這麼多瀏覽器相關的屬性。


關鍵是CSS3未正式發布,其中存在變數,帶上-webkit-和-moz-的專有屬性,畢竟不會失效。


規範未定。

這點也是很鬱悶,一個屬性要寫好幾次。


推薦閱讀:

寫前端頁面的時候,是先把html骨架寫好再寫css,還是一邊寫html,一邊寫css?
只用 CSS 能玩出什麼花樣?
前端工程師目前境況和三年後的發展狀況會怎麼樣呢?
要實現一個Web IDE 需要哪些前端技術?
怎麼評價國產框架MUI跟ReactNative的對比帖?

TAG:前端開發 | 網頁瀏覽器 | 萬維網聯盟W3C | CSS3 |