CSS——优雅降级和渐进增强
什么是渐进增强(progressive enhancement)、优雅降级(graceful degradation)呢?
渐进增强 progressive enhancement:
针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
类似 爬山,由低出往高处爬
优雅降级 graceful degradation:
一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。
类似蹦极,由高处往低处下落

区别:渐进增强是向上兼容,优雅降级是向下兼容。
建议: 现在互联网发展很快, 连微软公司都抛弃了ie浏览器,转而支持 edge这样的高版本浏览器,我们很多情况下没有必要再时刻想着低版本浏览器了,而是一开始就构建完整的效果,根据实际情况,修补低版本浏览器问题。
CSS——优雅降级和渐进增强的更多相关文章
- css优雅降级和渐进增强
今天看前端公众号发布的文章,学到了几个新词 1.modernizr 2.@support 3.优雅降级 其中第三个“优雅降级”,如此文艺的名字居然还是第一次听到.度娘了一下,发现[优雅降级],[渐进增 ...
- css可应用的渐进增强新特性
1. 让有滚动行为的元素平滑滚动 scroll-behavior: smooth; <div class="smooth"> </dvi> .smooth ...
- 浏览器兼容CSS渐进增强 VS 优雅降级如何选择
由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功能.二者的目的都是关注不同浏览器下的不同体验,但是它们侧重点不同,所以 ...
- 渐进增强与优雅降级 && css3中普通属性和前缀属性的书写顺序
什么是渐进增强与优雅降级? 服务器和浏览器是不同的.当服务器有新版本时,开发人员直接使用新版本的服务器提供服务即可:但是浏览器端,不同的用户使用的浏览器版本不同,型号差异大,我们不可能让用户强制更新 ...
- 优雅降级&渐进增强
优雅降级(Graceful Degradation) 关注点:最新的浏览器上构建体验很好的WEB应用. 降级:旧版本浏览器提供差强人意的体验,不影响功能的使用. 渐进增强(Progressive En ...
- BFC与优雅降级 渐进增强——学习笔记
BFC(块级格式化上下文) BFC(Block formatting context) 直译为"块级格式化上下文". 元素的显示模式 我们前面讲过 元素的显示模式 display. ...
- css3渐进增强 VS 优雅降级
印象中,渐进增强和优雅降级这两个概念是在 CSS3 出现之后火起来的.由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功 ...
- 渐进增强 VS 优雅降级
渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果.交互.追加功能达到更好的体验. 优雅降级(Gracefu ...
- 渐进增强(progressive enhancement)、优雅降级(graceful degradation)
渐进增强 progressive enhancement: 针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果.交互等改进和追加功能达到更好的用户体验. 优雅降级 grace ...
随机推荐
- YApi导入swagger生成的接口
1.swagger的JSON地址,net或netcore开发环境下 2.配置在内网中,localhost请用对应的IP地址替换,在浏览器地址栏中输入以上地址,会返回一个json格式的文档 3.导入 4 ...
- Jmeter+ant
1.下载 ant,解压到非中文目录,并配置环境变量,不会的自行 google 2.将 jmeter 中 extras 子目录里的 ant-jmeter-1.1.1.jar 复制到 ant 中的 lib ...
- <%#Eval() %>的常用方法
<%# %>用于数据绑定,通常是用在数据源控件里,比如GridView,Repeater等. 1.绑定Repeater 基础用法 <%# Eval("DriverName& ...
- sersync/lsyncd实时同步
第一章 sersync/lsync实时同步 1.1 实时同步服务原理/概念 1)需要部署好rsync守护进程服务,实现数据传输 2)需要部署好inotify服务,实现目录中数据变化监控 3)将rsyn ...
- 伪类元素before&after
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Spring Boot 2.X 实现文件上传(三)
使用 SpringBoot 项目完成单个.多个文件的上传处理,并将上传的文件保存到指定目录下. 代码演示案例 所有的 HTML 页面文件 index.html <!DOCTYPE html> ...
- Oracle 、MySql 数据库表被锁的原因分析
记录一次准备给客户预演示出现的问题 事故的背景: 当所以功能开发完成后,开发人员在本地进行了测视已经没问题了.就把所有开发的功能模块合并到 dev 分支,进行打包,发布到预演示的线上环境.当在给相关人 ...
- Servlet - request对象相关
request对象中封装了当前请求的所有请求信息, request对象由Tomcat服务器创建, 并作为实参传递给处理请求的Servlet的service()方法 1. 获取请求头数据 // 获取请求 ...
- 解析Spring第三天(面向切面AOP)
面向切面:AOP 在不修改源代码的基础上,对方法进行增强.AOP的底层原理就是代理技术(第一种:jdk的动态代理(编写程序必须要有接口).第二种:cglib代理技术(生成类的子类).如果编写的程序有借 ...
- 引入CSS样式表(书写位置)
CSS可以写到那个位置? 是不是一定写到html文件里面呢? 内部样式表 内嵌式是将CSS代码集中写在HTML文档的head头部标签中,并且用style标签定义,其基本语法格式如下: <head ...