首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

前端面试题-渐进增强优雅降级

一、背景介绍 渐进增强优雅降级这两个概念是在 CSS3 出现之后火起来的。...这使得渐进增强成为一种更为合理的设计范例。 3.2 优雅降级 优雅降级的观点:应针对最高级、最完善的浏览器来开发网站。...四、示例案例 如下的两段代码的书写顺序,表明了渐进增强优雅降级开发的重点不同。 ?...优雅降级的写法,优先考虑新版本浏览器的可用性,最后才考虑老版本的可用性。而在现在前缀CSS3正常CSS3都可用的情况下,前缀CSS3会覆盖正常的CSS3。...六、总结 其实优雅降级渐进增强都是网站开发的加分项,最重要的还是保证尽可能多的用户可以正常访问网站,在此之后再考虑降级的极端情形现代浏览器的体验增强。 阅读更多

73550
您找到你想要的搜索结果了吗?
是的
没有找到

【说站】css渐进增强优雅降级的区别

css渐进增强优雅降级的区别 区别说明 1、优雅降级始于复杂的现状,试图减少用户体验的供给。 2、渐进增强是从一个非常基础、可以起作用的版本开始。 不断扩展,以满足未来环境的需求。...3、降级意味着回顾,渐进增强意味着向前看,同时确保其基础处于安全区域。...-o-transition: all .5s;          transition: all .5s; } .transition { /*优雅降级写法*/           transition...       -o-transition: all .5s;      -moz-transition: all .5s;   -webkit-transition: all .5s; } 以上就是css渐进增强优雅降级的区别...更多css学习指路:css教程 本文教程操作环境:windows7系统、css3版,DELL G3电脑。 收藏 | 0点赞 | 0打赏

35810

第143天:渐进增强优雅降级之间的不同

渐进增强优雅降级之间的不同 1、渐进增强 .transition{ -webkit-transition: all .5s; -moz-transition: all .5s;...p=788) 3、什么是渐进增强(progressive enhancement)、优雅降级(graceful degradation)呢?   ...渐进增强(progressive enhancement):针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的、能够起作用的版本开始,并不断扩充,以适应未来环境的需要。...4、渐进增强观点:  渐进增强观点认为应该关注于内容本身。

63520

05-移动端开发教程-CSS3兼容处理

CSS3的标准并没有全部定稿,目前CSS3的标准分成了不同的模块,具体的标准由各个模块推动标准定稿,标准制定的过程中,浏览器也在不断的发新的版本来兼容新的标准。...css3的实验性的属性前需要添加前缀,目前大部分常用的css3新属性都可以直接舍弃前缀。...gulp 在线文档:地址 5. sass、less等预处理语言 sassless等css的预处理语言配合响应的编译工具也可以实现对css3中的新属性的自动化加前缀处理。...渐进增强优雅降级 渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。...优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试修复。

1.6K60

精选前端面试题之HTML5CSS3

13、什么叫优雅降级渐进增强?...渐进增强 progressive enhancement: 针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...优雅降级 graceful degradation: 一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。 区别: a. 优雅降级是从复杂的现状开始,并试图减少用户体验的供给 b....渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要 c....降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带 14、什么是语义化的HTML?

1.2K10

CSS3选择器 | 每个前端开发者必须要掌握的技术

目录 属性选择符 伪类选择符 CSS3属性 CSS3自适应 属性选择符 如果能够灵活运用属性选择器,目前为止需要依靠id或class名才能实现的样式 完全可以使用属性选择器来实现。...后边相邻的选择器会被选中,第一个li不会被选中 通用兄弟选择器: li ~ li:li后面的所有li元素被选中 子选择器: ul> li:ul后面直接的li元素被选中 9.渐进增强优雅降级 渐进增强(...优雅降级(Graceful Degradation): 一开始就构建站点的完整功能,然后针对浏览器测试修复。...区别: 优雅降级是从复杂的现状开始,并试图减少用户体验的供给; 而渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要; 降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看...“*” “/” 运算符不需要空白符,但考虑到统一性,仍然推荐加上空白符。

72210

05-移动端开发教程-CSS3兼容处理

CSS3的标准并没有全部定稿,目前CSS3的标准分成了不同的模块,具体的标准由各个模块推动标准定稿,标准制定的过程中,浏览器也在不断的发新的版本来兼容新的标准。...gulpgulp的插件的项目本地插件包。...gulp 在线文档:地址 5. sass、less等预处理语言 sassless等css的预处理语言配合响应的编译工具也可以实现对css3中的新属性的自动化加前缀处理。...渐进增强优雅降级 渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。...优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试修复。

1.9K120

Web前端最全面试宝典- CSS篇

link会同时被加载,而@import引用的CSS会等到页面被加载完再加载; 3)import是CSS2.1 提出的,只在IE5以上才能被识别,而link是XHTML标签,无兼容问题; 5.你能描述一下渐进增强优雅降级之间的不同吗...优雅降级 graceful degradation:一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。...区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要。...降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带。  “优雅降级”观点 “优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站。...“渐进增强”观点 “渐进增强”观点则认为应关注于内容本身。 内容是我们建立网站的诱因。有的网站展示它,有的则收集它,有的寻求,有的操作,还有的网站甚至会包含以上的种种,但相同点是它们全都涉及到内容。

1K10

前端面试宝典(四)

content: ""; display: table; } .clearfix:after{ clear: both; } .clearfix{ *zoom: 1; } ‍优点:代码简洁 5)什么叫优雅降级渐进增强...渐进增强 progressive enhancement: 针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...优雅降级 graceful degradation: 一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。 区别: a. 优雅降级是从复杂的现状开始,并试图减少用户体验的供给 b....渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要 c....降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带 6)px、em、rem的区别 PX px像素(Pixel)。相对长度单位。

70820

web前端常见面试题

渐进增强优雅降级 渐进增强 并不是一种技术,而是一种设计思想。各个浏览器的渲染能力各不相同,要做一个每个人都能看到的网页、感受到的体验都一致的网站几乎不可能。...但还是得网站的可访问性,保证用户在任何环境下都能正常访问网页得核心内容或能使用基本功能(避免网页打不开、排版错误等),并为他们提供当前条件下最好的体验,这就是渐进增强得核心思想。...优雅降级 也是一种设计思想,为了保证在高版本浏览器中提供最好的体验,碰到低版本浏览器再降级进行兼容处理,使其能正常浏览。...这两种思想的区别在于: 渐进增强是向上兼容,优雅降级是向下兼容; 渐进增强是从简单到复杂,优雅降级是从复杂到简单; 渐进增强关注的是内容(保证核心内容),优雅降级关注的是浏览体验(为了兼容低版本浏览器)...有利于 SEO,搜索引擎根据标签来确定上下文各个关键字的权重。 方便其他设备解析,如盲人阅读器根据语义渲染网页。 有利于开发维护,语义化更具可读性,代码更好维护,与 CSS3 关系更和谐。

2.3K20

Sentinel限流降级如何优雅的返回?SentinelResource注解之blockHanderfallback

熔断限流规则持久化到 Nacos 配置中心 提到的一个问题:之前我们访问接口进行限流或者降级后,直接返回500错误,或者提示 flow limit 之类的东西: 这样显得很不优雅,透漏着不专业,那么进行限流或者降级后该如何进行优雅的返回呢...本章从 Sentinel 的 「热点参数限流」 着手,使用注解 @SentinelResource 的 blockHandler fallback 来实现限流后优雅的返回。...若 blockHandler fallback 都进行了配置,则被限流降级而抛出 BlockException 时只会进入 blockHandler 处理逻辑。...若未配置 blockHandler、fallback ,则被限流降级时会将 BlockException 「直接抛出」。...如果同时配置了 blockHandler fallback 属性,则被限流降级而抛出 BlockException 时只会进入 blockHandler 处理逻辑。

1K10

前端面试之HTML && CSS

important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性 渐进增强优雅降级的理解及区别 渐进增强(Progressive Enhancement)...优雅降级(Graceful Degradation): 一开始就构建站点的完整功能,然后针对浏览器测试修复。...两者区别 1、广义: 其实要定义一个基准线,在此之上的增强叫做渐进增强,在此之下的兼容叫优雅降级 2、狭义: 渐进增强一般说的是使用CSS3技术,在不影响老浏览器的正常显示与使用情形下来增强体验...,而优雅降级则是体现html标签的语义,以便在js/css的加载失败/被禁用时,也不影响用户的相应功能。...-o-transition: all .5s; transition: all .5s; } .transition { /*优雅降级写法*/ transition

4.4K10

第213天:12个HTMLCSS必须知道的重点难点问题

使用Flex 只需要在父盒子设置:display: flex; justify-content: center;align-items: center; 使用 CSS3 transform 父盒子设置:...响应式开发 利用CSS3 中的 Media Query(媒介查询),通过查询 screen 的宽度来指定某个宽度区间的网页布局。...9.渐进增强优雅降级 关键的区别是他们所侧重的内容,以及这种不同造成的工作流程的差异 优雅降级一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。。...渐进增强针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...区别: 优雅降级是从复杂的现状开始,并试图减少用户体验的供给 渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要 降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看

2.2K20

产品必懂技术术语:什么是浏览器兼容性?

浏览器兼容性从表现形式上可分为样式兼容性(css)交互兼容性(javascript)。 兼容性问题解决方案 兼容性问题一般有2种解决方案,优雅降级渐进增强。...优雅降级 在没有好的解决方案时,一般是采用优雅降级的方案, 举个例子:比如我们现在的很多UI框架里面使用的js属性,IE8及以下浏览器是不支持的。...渐进增强 使用另一种解决方案来达到一样效果的方式,就是渐进增强。 比如有一个样式属性,在safari浏览器不支持,那么我们可以通过别的属性或结构来达到一样的视觉表现效果。...兼容性分类 浏览器兼容性从设备来分,又可以分为pc端兼容性移动端兼容性。 PC端移动端的操作系统不一样,浏览器内核也有一定的区别。...PC端的兼容性只受windowsmac操作系统固定的几个浏览器影响, 但是移动端还会被不同的手机厂商所影响,因为不同的手机厂商,手机内嵌的浏览器不一样,所以移动端需要解决的兼容性问题更多。

79120

【前端】html+css 面试题总结(不含答案)

什么是渐进增强优雅降级 浏览器的内核分别是什么?经常遇到 的浏览器兼容问题有哪些?原因,解决方法是什么?...有什么缺点 Label的作用是什么,是怎么用的 src href 的区别 alt title 的区别 有哪项方式可以对一个 DOM 设置它的 CSS 样式?...CSS3 新增伪类有哪 些? 选择器空格>的区别 + ::before与:after中双冒号单冒号的区别?解释一下这个伪元素的作用?...flex居中布局 圣杯布局双飞翼布局 如何实现水平居中和垂直居中(请举例多种) 如何垂直居中一个浮动元素 请写出css 实现垂直居中的3种以上的方法 浏览器标签模式与怪异模式 重排重绘,讲讲看 BFC...是什么 Sassless有什么区别?

55820

2022高频前端面试题——CSS篇

你能描述一下渐进增强优雅降级之间的不同吗?...参考回答: 渐进增强 (progressive enhancement):针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...优雅降级 (graceful degradation):一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。...区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要。...降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带。 22. CSS3 新增了那些东西?

1.4K30

前端面试题(HTMLCSS)

strong:粗体强调标签,强调,表示内容的重要性 em:斜体强调标签,更强烈强调,表示内容的强调点 06 你能描述一下渐进增强优雅降级之间的不同吗?...渐进增强 progressiveenhancement:针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进追加功能达到更好的用户体验。...优雅降级 gracefuldegradation:一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。...区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要。...降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带。 “优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站。

73320
领券