优雅降级和渐进增强

这两个概念是在CSS3出现之后,由于低级浏览器不支持CSS3,但是CSS3特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功能。二者的目的都是关注不同浏览器下的不同体验,但是它们侧重点不同,所以导致了工作流程上的不同。

一、优雅降级 graceful degradation
一开始构建完整的功能,然后再向下兼容低版本浏览器。金字塔式写法。

.transition{ 
       transition: all .5s;
    -o-transition: all .5s;
   -moz-transition: all .5s;
 -webkit-transition: all .5s;
}

二、渐进增强 progressive enhancement
一开始保证最基本的功能,然后再向上兼容高版本浏览器。漏斗式写法,推荐。

.transition{
  -webkit-transition: all .5s;
     -moz-transition: all .5s;
       -o-transition: all .5s;
          transition: all .5s;  
}
原文地址:https://www.cnblogs.com/camille666/p/css3_gd_pe.html