1

有了新的浏览器增强功能，例如 CSS3 动画、渐变、SVG 背景等……新浏览器不必下载旧版 CSS 代码，旧版浏览器不必下载高级 CSS 代码。那么在 HTTP 级别（没有服务器端编程方法）你如何处理这样的问题？您是否应该将 base.css 文件提供给两组浏览器，然后根据请求的浏览器组提供一个额外的 CSS 文件？有没有办法包含一个简单地将浏览器重定向到浏览器组特定重写的 CSS 文件？或者这是应该首先在客户端弄清楚并下载的东西？

4

2 回答 2

0

完全接受优雅降级和渐进增强的概念将允许您对所有目标浏览器使用相同的 css - 简而言之，如果浏览器不支持 css3 圆角 - 给它供应商前缀规则；如果它也不支持 - 没什么大不了的，该网站仍然可以使用方角。

与额外的 http 请求相比，下载具有供应商特定前缀和标准前缀的规则的开销将是最小的，并且将提高可维护性并通过不必依赖浏览器检测来为您省去麻烦。

特定于布局的 hack 通常只能应用于 IE 系列，它可以由 html 条件注释定位。

于 2012-04-06T08:15:47.063 回答
0

我发现有三种方法可以做到这一点。

  1. 为每个样式表和 javascript 资产使用一个大文件，然后使用诸如modernizr 和特性嗅探之类的东西来清除哪个浏览器在做什么。或者只是让所有浏览器都做同样的事情。这更适合开发输入和测试。

  2. 使用两个文件（一个名为 Ancient.css，另一个名为 modern.css）并使用服务器端 HTTP 嗅探器操作检查浏览器的版本，然后为其提供适当的文件。将HTTP缓存设置为远期过期，防止每次访问服务器查看下载哪个文件。要生成文件，只需创建一个文件，其中包含所有浏览器之间共享的所有核心内容，另一个包含旧浏览器的模拟内容。好处是你可以使用所有新的 CSS3 和 HTML5-JavaScript 东西，但缺点是你需要测试以确保现代浏览器代码的东西与古老的东西一样工作。

  3. 有两个资产文件（现代 + 古代）并首先下载现代。然后让浏览器通过modernizr查看它是否支持某些东西，如果不支持，则让它下载古代文件。这样做的好处是您不需要开发任何额外的服务器端内容，但缺点是您的网站渲染速度会变慢，并且您可能会同时下载同一资源的多个下载。

于 2012-08-15T03:08:53.953 回答