HTML5和CSS3有什么好的后备吗？

Question

我正在为HTML5和CSS3寻找一个好的后备,所以我可以使用它,它在其他浏览器中看起来仍然可以.

Answer 1

在谈论HTML5或CSS3时,您应该前往:

我什么时候可以用......

可以看出,我们距离使用它还有很远的距离.

此外,由于旧版本的浏览器不支持HTML5或CSS3,您可以执行以下所谓的操作:

渐进式增强和优雅降级

以下是一些资源:

• HTML5网站的图库(您可以从中学习并从中获取想法)
• 使用HTML5和CSS3创建现代网站

Answer 2

查看Google Chrome浏览器内嵌框架,看看是否有可能通过您网站的全功能版本覆盖更多用户.并且还针对特定功能进行功能检查.

什么是Modernizr？

Modernizr是一个小而简单的JavaScript库,可帮助您利用新兴的Web技术(CSS3,HTML 5),同时仍然保持对可能尚不支持这些新技术的旧浏览器的良好控制.

Modernizr使用特征检测来测试当前浏览器与即将推出的功能,如rgba(),border-radius,CSS Transitions等等.这些目前正在跨浏览器实现,使用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