15

我正在为 HTML5 和 CSS3 寻找一个很好的后备方案，这样我就可以使用它，而且它在其他浏览器中看起来仍然不错。

4

2 回答 2

10

在谈论 HTML5 或 CSS3 时，您应该转到：

什么时候可以用...

可以看出，我们离使用它还很远。

此外，由于旧版本的浏览器不支持 HTML5 或 CSS3，但是，您可以执行以下操作：

渐进增强和优雅降级

这里还有一些资源：

于 2010-04-21T08:21:19.310 回答
8

查看Google Chrome Frame，看看是否有可能通过您网站的全功能版本吸引更多用户。并且还对特定功能进行功能检查。

什么是Modernizr？

Modernizr是一个小型且简单的 JavaScript 库，可帮助您利用新兴的 Web 技术（CSS3、HTML 5），同时仍保持对可能尚不支持这些新技术的旧浏览器的精细控制。

Modernizr 使用特征检测来测试当前浏览器与即将推出的功能，如 rgba()、border-radius、CSS 过渡等等。这些目前正在跨浏览器实现，借助 Modernizr，您可以立即开始使用它们，并通过一种简单的方法来控制尚不支持它们的浏览器的回退。

此外，Modernizr 创建了一个自命名的全局 JavaScript 对象，其中包含每个特性的属性；如果浏览器支持它，该属性将评估true，如果不支持，它将是false.

最后，Modernizr 还添加了对样式化 HTML 5 元素的支持。这使您可以使用更多语义、前瞻性的元素，例如<section>，<header>而<dialog>不必担心它们在 Internet Explorer 中不起作用。

Modernizr 不做的事情

Modernizr 不会向浏览器添加缺失的功能；相反，它会检测功能的本机可用性，并为您提供一种方法来保持对您的站点的精细控制，而不管浏览器的功能如何。

我在Dive Into HTML5中读到了它

一些样本：

if (Modernizr.canvas) {
  // let's draw some shapes!
} else {
  // no native canvas support available :(
}

if (Modernizr.video) {
  // let's play some video!
} else {
  // no native video support available :(
  // maybe check for QuickTime® or Flash® instead
}

if (Modernizr.localstorage) {
  // window.localStorage is available!
} else {
  // no native support for local storage :(
  // maybe try Gears or another third-party solution
}

if (Modernizr.webworkers) {
  // window.Worker is available!
} else {
  // no native support for web workers :(
  // maybe try Gears or another third-party solution
}

if (Modernizr.applicationcache) {
  // window.applicationCache is available!
} else {
  // no native support for offline :(
  // maybe try Gears or another third-party solution
}

if (Modernizr.geolocation) {
  // let's find out where you are!
} else {
  // no native geolocation support available :(
  // maybe try Gears or another third-party solution
}
...

有时该网站建议使用后备技术，例如用于 IE的Explorercanvas (excanvas.js)或用于地理定位的geo.js

于 2010-04-21T08:29:35.487 回答