優雅降級:一開始就建構完整的功能,然後再針對低版本浏覽器進行相容。
.transition { /*優雅降級寫法*/
transform:rotate(30deg);
-o-transform: rotate(30deg);//-o opera浏覽器字首
-moz-transform: rotate(30deg);// -moz代表firefox浏覽器私有屬性
-webkit-transform: rotate(30deg);// -webkit代表chrome、safari私有屬性
// -ms代表IE浏覽器私有屬性
}
漸進增強:針對低版本浏覽器進行建構頁面,保證最基本的功能,然後再針對進階浏覽器進行效果、互動等改進和追加功能達到更好的使用者體驗。
.transition { /*漸進增強寫法*/
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
-o-transform: rotate(30deg);
transform: rotate(30deg);
}
差別:漸進增強是向上相容,優雅降級是向下相容。
建議: 現在網際網路發展很快, 連微軟公司都抛棄了ie浏覽器,轉而支援 edge這樣的高版本浏覽器,我們很多情況下沒有必要再時刻想着低版本浏覽器了,而是一開始就建構完整的效果,根據實際情況,修補低版本浏覽器問題。
參考 參考連結