優雅降級和漸進增強印象中是隨著CSS3流出來的一個概念,由于低級瀏覽器不支持CSS3,但css3的效果又太優秀不忍放棄,所以在高級瀏覽器中使用CSS3而低級瀏覽器只保證最基本的功能。咋一看兩個概念差不多,都是在關注不同的瀏覽器下的不同體驗,關鍵的區別是他們所側重的內容,以及這種不同造成的工作流程的差異。
舉個例子
a{ display:block; width:200px; height:100px; background:aquamarine; /*我就是要用這個新css屬性*/ 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:200px } /*那如果我們的產品要求我們要重低版本的瀏覽器兼容開始*/ a{ /*優先考慮低版本的*/ -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; /*高版本的就肯定是漸進漸強*/ transition: all 1s ease 0s; }
"優雅降級"觀點認為應該針對那些最高級。最完美的瀏覽器來設計網站。
“漸進增強”觀點則認為應關注于內容本身。