发表于: 2018-08-13 23:08:41

1 682


今天完成的事情:大致重写完了任务九

明天计划的事情:学习制作小课堂

遇到的问题:做的页面不规范,样式不合格,重新修改样式

收获:

渐进增强

在网页开发中,渐进增强认为应该专注于内容本身。一开始针对低版本的浏览器构建页面,满足最基本的功能,再针对高级浏 览器进行效果,交互,追加各种功能以达到更好用户体验,换句话说,就是以最低要求,实现最基础功能为基本,向上兼容。以css为例,以下这种写法就是渐进增强。


优雅降级

在网页开发中,优雅降级指的是一开始针对一个高版本的浏览器构建页面,先完善所有的功能。然后针对各个不同的浏览器进行测试,修复,保证低级浏览器也有基本功能 就好,低级浏览器被认为“简陋却无妨 (poor, but passable)” 可以做一些小的调整来适应某个特定的浏览器。但由于它们并非我们所关注的焦点,因此除了修复较 大的错误之外,其它的差异将被直接忽略。也就是以高要求,高版本为基准,向下兼容。同样以css为例,优雅降级的写法如下。

二者区别

渐进增强提供了较好的平台稳定性,维护起来资金小, 长期来说降低开发成本。相对于优雅降级来说,开发周期长,初期投入资金大。

优雅降级可以在较短时间内开发出一个只用于一个浏览器的完整功能版,然后就可以拿给PM找客户谈呀,可以拿去测试,市场试水。

什么是 Quirks Mode?

Quirks Mode 就是浏览器为了兼容很早之前针对旧版本浏览器设计、并未严格遵循 W3C 标准的网页而产生的一种页面渲染模式。

 Quirks Mode是一种浏览器(像IE,Firefox,Opera)操作模式。 从根本上说,怪异模式(也称之为兼容模式)意味着一个相对新的浏览器故意模拟许多在旧浏览器中存在的bug,特别是在IE4和IE5中。

从IE6开始,引入了Standards模式,标准模式中,浏览器尝试给符合标准的文档在规范上的正确处理达到在指定浏览器中的程度。

区别:

盒模型:在W3C标准中,如果设置一个元素的宽度和高度,指的是元素内容的宽度和高度,而在Quirks 模式下,IE的宽度和高度还包含了padding和border。

设置行内元素的高宽:在Standards模式下,给<span>等行内元素设置wdith和height都不会生效,而在quirks模式下,则会生效。

设置百分比的高度:在standards模式下,一个元素的高度是由其包含的内容来决定的,如果父元素没有设置百分比的高度,子元素设置一个百分比的高度是无效的用margin:0 auto设置水平居中:使用margin:0 auto在standards模式下可以使元素水平居中,但在quirks模式下却会失效。



任务总结:

任务名称:CSS=TASK13

成果链接:https://tinklegcy.github.io/css1/task13/zhuoyou.html

任务耗时:2018/8/8-2018/8/8,无延期

技能脑图:

个人脑图:



官方脑图:


任务总结:

    1. 任务进度符合预期,无延期
    2. 脑图对比分析
    3. 依旧是sass重写页面。在任务十三中用了样式分离,代码清晰方便修改维护;还有样式重置,为了浏览器兼容,重置浏览器默认样式。









返回列表 返回列表
评论

    分享到