渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。

优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用,然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。

比如:

.transition { /*渐进增强写法*/
-webkit-transition: all .5s;
-moz-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.transition { /*优雅降级写法*/
transition: all .5s;
-o-transition: all .5s;
-moz-transition: all .5s;
-webkit-transition: all .5s;
} 作者:康斌
链接:https://www.jianshu.com/p/d313f1108862
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

渐进增强 VS 优雅降级的更多相关文章

  1. 浏览器兼容CSS渐进增强 VS 优雅降级如何选择

    由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功能.二者的目的都是关注不同浏览器下的不同体验,但是它们侧重点不同,所以 ...

  2. 渐进增强与优雅降级 && css3中普通属性和前缀属性的书写顺序

     什么是渐进增强与优雅降级? 服务器和浏览器是不同的.当服务器有新版本时,开发人员直接使用新版本的服务器提供服务即可:但是浏览器端,不同的用户使用的浏览器版本不同,型号差异大,我们不可能让用户强制更新 ...

  3. css3渐进增强 VS 优雅降级

    印象中,渐进增强和优雅降级这两个概念是在 CSS3 出现之后火起来的.由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功 ...

  4. 兼容性/pollyfill/shim/渐进增强/优雅降级

    http://ued.ctrip.com/blog/browser-compatibility-testing-tools-in-firefox-compatibility-detector.html ...

  5. css考核点整理(十二)-能描述下你在项目中都用到了哪些符合逐渐增强和优雅降级的理念的技巧吗

    能描述下你在项目中都用到了哪些符合逐渐增强和优雅降级的理念的技巧吗

  6. css优雅降级和渐进增强

    今天看前端公众号发布的文章,学到了几个新词 1.modernizr 2.@support 3.优雅降级 其中第三个“优雅降级”,如此文艺的名字居然还是第一次听到.度娘了一下,发现[优雅降级],[渐进增 ...

  7. 优雅降级&渐进增强

    优雅降级(Graceful Degradation) 关注点:最新的浏览器上构建体验很好的WEB应用. 降级:旧版本浏览器提供差强人意的体验,不影响功能的使用. 渐进增强(Progressive En ...

  8. 渐进增强(progressive enhancement)、优雅降级(graceful degradation)

    渐进增强 progressive enhancement: 针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果.交互等改进和追加功能达到更好的用户体验. 优雅降级 grace ...

  9. CSS——优雅降级和渐进增强

    什么是渐进增强(progressive enhancement).优雅降级(graceful degradation)呢? 渐进增强 progressive enhancement: 针对低版本浏览器 ...

随机推荐

  1. Dell 1420N使用Kubuntu默认无线驱动后网络不稳定的解决方法

    前几天在我的Dell 1420N上安装了Kubuntu 13.04,装了系统软件中的私有无线网卡驱动Broadcom STA wireless driver后,虽然能上网,但是很不稳定,经常断线,非常 ...

  2. Windows ---- mysql 5.7 配置安装

    去官网下载mysql 下载地址    https://dev.mysql.com/downloads/mysql/    根据自己操作系统位数选择相对应的版本 点击Download下载 下载下来后是一 ...

  3. tp5 whereOr

    题目:查询grade=1 or class=2 or sex=3的学生 $condition[; $condition[; $condition[; $list =Db::name($this-> ...

  4. 路飞项目背景,contentType以及django缓存

    昨日回顾: 分页器: 普通分页 # 普通分页 from rest_framework.pagination import PageNumberPagination -每页的大小(默认) -查询的时候, ...

  5. win10 64位 python3.6 django1.11 MysqlDB No module named 'MySQLdb' 安装MysqlDB报错 Microsoft Visual C++ 14.0 is required

    在python3.6中操作数据库,再按python2.7安装MySQLdb进行数据库连接已经不可用了,我使用的是另外一个方法:PyMySQL,安装好之后还是不能直接连接MySQL的,启动项目后报No ...

  6. C#开发重用方法

    获取类型先关信息 GetType()及typeof()

  7. Ceph介绍

    1. 介绍 云硬盘是IaaS云平台的重要组成部分,云硬盘给虚拟机提供了持久的块存储设备.目前的AWS 的EBS(Elastic Block store)给Amazon的EC2实例提供了高可用高可靠的块 ...

  8. 51建设Android版一些技术整理

    不知不觉几个月就过去了,新项目已经发了两个大的版(其实已经迭代了3版),趁着项目新版刚刚上线闲下来的时间整理下用到的技术点. 整体架构 采用MVP Android官方MVP架构示例项目解析 推荐一个插 ...

  9. .NET基础 (02).NET运行机制

    .NET运行机制1 .NET程序被编译成什么形式的代码2 JIT是如何工作的3 简述程序集的加载机制4 如何配置程序集的版本策略 1 .NET程序被编译成什么形式的代码 .NET程序在编写完成后,会经 ...

  10. 安装了IntelliJ IDEA中文输入法光标不跟随处理办法

    安装了IntelliJ IDEA 2017.2.3版本发现搜狗输入法中文输入的时候光标不跟随,而且存在卡屏的现象,网上找了很多办法试了之后都不管用.最后在这里找到了解决方案,亲测可用! 首先,将IDE ...