html - 使用背景图像或 CSS3 渐变更好吗？（电话间隙）

Question

假设我正在使用一个 DIV 元素，我可以为其添加背景图像，也可以复制相同的样式来创建 CSS3 渐变。现在，对于 Phonegap 应用程序（所有图像文件都驻留在设备本身中），哪个选项更好。

我问这个是因为我在某处看到渐变需要一些计算时间，而使用图像可能会产生加载时间问题。但对于 Phonegap 应用程序，可能不存在图像加载时间问题。那么，也许在这里使用图像是一个更好的选择？

Answer 1

根据 Webkit Wiki 上的一篇文章，图像表现更好：

有时使用 webkit 的绘图功能（如 -webkit-gradient）很诱人，但实际上并不需要 - 维护图像和处理 Photoshop 和绘图工具可能会很麻烦。但是，将 CSS 用于这些任务会将麻烦从设计者的计算机转移到目标的 CPU。CSS 中的渐变、阴影和其他装饰应仅在必要时使用（例如，当形状根据内容动态时）——否则，静态图像总是更快。在非常低端的平台上，如果可能的话，甚至建议对某些文本使用静态图像。

来源：https ://trac.webkit.org/wiki/QtWebKitGraphics#Usestaticimages

当然，您必须平衡 CPU 时间与从服务器加载图像所需的额外时间。此外，对于 Internet Explorer，过滤器非常慢，尤其是如果您在一页上有很多过滤器。