CSS3背景的最佳实践和对旧浏览器的支持？

我的同事和我在为我们正在建设的站点确定ie6、ie7支持的最佳实践方法时遇到了困难。该网站面向的是年龄较大的人群，因此不支持这些浏览器是不可能的

同时，我们正试图开始将现代编码实践融入到我们的工作中，以便我们能够进行实践并充分理解能力。我想和你们讨论的一个具体领域是处理CSS3背景的后备方案

如果要使用CSS3背景，而不为背景添加无关的包装标签，这里有两种选择：

• 使用：after、：before等伪元素为元素添加多个背景。（这是我们目前的选择）
• 使用CSS3多个后台规范

这会产生更优雅的标记，这无疑是朝着正确方向迈出的一步。但是不支持这些功能的浏览器呢

告诉我们检查特定支持，然后写回退：

Modernizr.load({
  test: Modernizr.geolocation,
  yep : 'geo.js',
  nope: 'geo-polyfill.js'
});

然而，对于具体功能的实际回退，我们没有得到太多的指导。那么，在类似CSS3背景的情况下，什么是有效的回退策略

我们（例如）是否会使用jQuery将我们需要的额外标记（即btn容器、nav容器等）包装在nav项、按钮和容器周围，以便有额外的元素添加样式属性

我们（例如）是否会使用jQuery将我们需要的额外标记（即btn容器、nav容器等）包装在nav项、按钮和容器周围，以便有额外的元素添加样式属性

这当然是一种有效的回退方法。但是，根据所讨论的设计和元素，您可能会发现，仅提供主要背景就足以生成外观良好、功能完善（尽管视觉上不完全相同）的组件

---

“支持”较旧的浏览器并不总是意味着“付出巨大的努力/编写大量额外的代码以确保接近视觉匹配。”很难但并非不可能组建一个QA团队，让他们理解渐进式增强的概念，因为它可以应用于纯视觉演示的各个方面。

关于CSS3

多个背景和/或
背景梯度
我认为有一种方法比你提出的方法更好：

通过这种方式，您将能够在IE6、7和8中使用所有这些出色的效果（还包括
border radious
），而无需任何JavaScript干预。
1。优雅地失败。例如，某些复杂元素可以通过CSS隐藏，并在页面加载时通过JavaScript显示，具体取决于浏览器

2。有条件的样式表或JavaScript修复。花大量时间修复每个浏览器中的每个问题，并为其编写样式表。此外，您还可以尝试各种Javascript，它们声称可以使较旧的浏览器符合法规。我尝试了，但它似乎与jQuery冲突是另一个将圆角引入旧浏览器的选项

3。忽略旧浏览器。对旧浏览器不做任何特殊操作。IE6/7上的人对世界的看法已经不同于其他人。或者，对旧浏览器不做任何特殊的操作，而是积极避免过于复杂的功能。或者，您可以不费吹灰之力就添加一个漂亮的。
现在CSS3Pie的性能如何？我尝试在应用程序UI中大量使用第一个版本（可能被标记为beta版），发现页面上超过50个VML实例可能会使浏览器陷入困境。我没有同时在超过15个元素上使用它，但这至少是意料之中的，因为那些旧浏览器的渲染引擎并不是为这种复杂性而创建的。但我认为当前版本在性能方面做得很好。谢谢你的建议，埃里克。这看起来是一个很好的解决方案=）在大多数情况下，我们正在删除ie6中的功能，但有一些功能（如背景）如果我们不支持它们，它们将彻底破坏一切。