首頁  >  文章  >  web前端  >  為什麼css3要加前綴

為什麼css3要加前綴

青灯夜游
青灯夜游原創
2021-11-02 14:17:571881瀏覽

因為CSS3還未成為真正的標準,許多瀏覽器對其的支援程度不同,而且每個瀏覽器廠商對同一個樣式支援的寫法也不同,所以要加前綴來達到各個瀏覽器相容。 css3前綴就是用來確保新屬性可以在特定的瀏覽器渲染引擎下被辨識和生效。

為什麼css3要加前綴

本教學操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。

使用過CSS3屬性的同學都知道,CSS3屬性都需要帶各瀏覽器的前綴,甚至到現在,還是還有很多屬性需要帶前綴。這是為什麼呢?

瀏覽器廠商以前就一直在實作CSS3,但它還未成為真正的標準。

因為css3很多屬性還沒確定下來,標準規格還沒發布,許多瀏覽器支援的程度也不同,而且每個瀏覽器廠商同一個樣式支援的寫法也不同,所以要加前綴來要達到各個瀏覽器相容,將來統一了規範就不用寫前綴了。

css3前綴就是用來確保這種屬性可以在特定的瀏覽器渲染引擎下被辨識和生效。

前綴 #瀏覽器 內核
- ms- IE瀏覽器 Trident核心
-moz- Firefox Gecko核心
-o- Opera Presto核心
-webkit- Chrome和Safari Webkit核心

目前已有很多私有前綴可以不寫了,但為了相容舊版的瀏覽器,可以仍沿用私有前綴和標準方法,逐漸過渡。

來看一個簡單的範例,早期寫一個圓角border-radius ,需要這樣寫:

.box {
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -o-border-radius: 5px;
}

這些是為了相容於舊版的寫法,該瀏覽器不支援新屬性而導致使用者體驗友善度降低;比較新版本的瀏覽器都支援直接寫入:border-radius。

使用前綴則能很好地匹配到較低版本的瀏覽器,並且正常顯示樣式。

(學習影片分享:css影片教學

以上是為什麼css3要加前綴的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn