通过Modernizr安全地使用HTML 5和CSS 3

2011 年 6 月 10 日

使用 HTML 5 和 CSS 3 的主要问题不是普及程度和浏览器之间的差异,而在于首先了解这些差异是什么。一旦搞清楚,开发人员就能够采用优雅降级 (graceful degradation) 技术解决这些局限性。为此,许多开发人员求助于开源项目 Modernizr。

Modernizr 不是检测 user-agent 字符串,而是使用一系列测试来判断浏览器的特性。在几毫秒内它就能够执行超过 40 种测试并将结果作为属性记录在名为 Modernizr 的对象中。开发人员可以通过这些信息检测他们准备使用的某特性是否被浏览器支持并作出相应的处理。

在Modernizr 2.0 版中,它增加了一个针对 JavaScript 和 CSS 的条件资源加载器 (conditional resource loader)。该资源加载器接受三个参数,第一个是表达式,列举了所需的特性。第二个参数是如果表达式返回 true 则加载的 JavaScript 和 CSS 文件列表。第三个参数是所需特性不存在的情况下备用的文件列表。

除了优雅降级,加载器还可用于引入 polyfill 。请允许我向那些还不太熟悉 pollyfill 的朋友解释一下,pollyfill 是“一种 JavaScript 垫片 (shim),为老版本浏览器模拟了标准 API”。虽然这种方式不总是值得推荐,但是 pollyfill 能够用来添加(Modernizr 检测到的)大多数 HTML 5 特性的支持。

为了改进性能,开发人员可以定制 Modernizr 来执行网站所需的测试。这可以通过 Modernizr 下载页面来完成,该页面同时显示了能够检测的特性列表。在 github 网站上还标有无法检测的特性和可能的解决办法

查看英文原文 Safely use HTML 5 and CSS 3 Today with Modernizr

2011 年 6 月 10 日 10:533192
用户头像

发布了 501 篇内容, 共 210.9 次阅读, 收获喜欢 21 次。

关注

评论

发布
暂无评论
发现更多内容

训练营第三周作业 1

仲夏

极客大学架构师训练营

第三周作业

架构师训练营第 1 期 03 周 总结

Geek_a01290

极客大学架构师训练营

第3周作业

TheSRE

训练营第三周作业 2

仲夏

极客大学架构师训练营

架构师训练营第 1 期-week3

习习

架構師訓練營第 1 期 - 第 03 周總結

Panda

架構師訓練營第 1 期

架构师训练营第 1 期 -Week3 - 代码重构学习总结

鲁小鲁

设计模式 极客大学架构师训练营

架构师训练营 week3 作业

陈皓07

组件模式

积极&丧

极客大学架构师训练营

第三周作业

fmouse

极客大学架构师训练营

架构师训练营第 1 期 03 周 作业

Geek_a01290

极客大学架构师训练营

架构师训练营-第三周学习总结

咖啡

架构师训练营作业:第三周

m

第三周第一题

sean

第二讲 学习总结

mm马

极客大学架构师训练营

第三周总结

第3周学习总结:设计模式

云峰

第二讲 作业一

mm马

极客大学架构师训练营

设计模式总结

天天向上

极客大学架构师训练营

架构师作业-第三周-单例

袭望

单例模式

第三周第二题

sean

LeetCode题解:49. 字母异位词分组,数组排序,JavaScript,详细注释

Lee Chen

LeetCode 前端进阶训练营

常用设计模式

wing

架構師訓練營第 1 期 - 第 03 周作業

Panda

架構師訓練營第 1 期

第三周作业及笔记

橘子皮嚼着不脆

组合模式程序案例

天天向上

极客大学架构师训练营

手写单例模式(登记式/静态内部类)

orchid9

第三周笔记

orchid9

spring-boot-route(四)全局异常处理

Java旅途

Java Spring Boot

第 3 周作业:手写单例模式

云峰

通过Modernizr安全地使用HTML 5和CSS 3-InfoQ