渐进增强和优雅降级之间的不同

渐进增强和优雅降级概念出现的原因：

由于CSS3出现，标准还没有确定之前，部分浏览器已经支持CSS3的部分功能。所以产生了的一种解决方式在高级浏览器中使用CSS3，而在低级浏览器只保证最基本的功能。

渐进增强（Progressive Enhancement）：

优先针对低版本浏览器构建页面，完成基本的功能，然后再针对高级浏览器进行效果、交互、追加功能等让用户达到更好的体验。部分案例：

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

优雅降级 （graceful degradation）：

优先构建站点的完整功能，然后针对低版本浏览器进行兼容。部分案例：

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

优雅降级和渐进增强只是看待同一种事物的两种不同观点：优雅降级和渐进增强都关注于同一网站内容在不同设备里不同浏览器下的表现程度。关键的区别则在于它们出发点在于何处，对工作流程的影响是什么。

在网页布局中常用那个？

大多数网站都是采用渐进增强的方式，由于业务优先，所以提升用户体验永远不会排在最前面。列如：大型网站淘宝，京东，微博等，绝对不会追求某个特效而不考虑低版本用户的可用性。

当然也有一部分，为小众用户（青少年）架设的网站，这个群体人员总是会把浏览器更新到最新版本，而且喜欢酷炫的特效。

此外

有四个常用降级和增强的CSS3属性如下：

border-radius

box-shadow

transition

transform