优雅降级、渐进增强

优雅降级和渐进增强是随着css3流出来的一个概念，由于低级浏览器不支持css3，但css3效果太优秀，又不忍放弃，所以在高级浏览器中使用css3而低级浏览器只保证最基本的功能。

举个栗子：

优雅降级

a{
            display: block;
            width: 200px;
            height: 200px;
            background: aquamarine;
            /*这是一个新的css3属性，我们要用它*/
            transition: all 1s ease 0s;
            /*可发现一些低版本的浏览器不支持怎么办*/
            /*那就向下兼容吧*/
            -webkit-transition: all 1s ease 0s;
            -moz-transition: all 1s ease 0s;
            -o-transition: all 1s ease 0s;
            /*通常这样考虑的和这样的侧重点出发的CSS就是优雅降级*/
        }
        a:hover{
            height: 500px;
}

 

渐进增强：

a{
            display: block;
            width: 200px;
            height: 200px;
            background: aquamarine;
            /*产品要求我们从低版本的浏览器兼容开始*/
            /*优先考虑低版本的*/
            -webkit-transition: all 1s ease 0s;
            -moz-transition: all 1s ease 0s;
            -o-transition: all 1s ease 0s;
            /*高版本的在后面就是渐进增强*/
            transition: all 1s ease 0s;
            /*通常这样考虑的和这样的侧重点出发的CSS就是渐进增强*/
}
a:hover{
    height: 500px;
}

优雅降级针对的是最高级、最完善的浏览器来设计网站。

渐进增强主要是关注与内容本身，不太注重样式。