我有一个简单的技术演示的想法。它将有大量(可能多达 100 个)具有不同旋转和 Z 顺序的不同文本标签。此外，还会有持续的动画，因此标签的大小、旋转和位置都会发生变化。
据我所知，这可以使用 CSS3 或 Canvas 来完成。 CSS3 方法应该更易于访问，但是否还有其他真正的差异需要考虑？
编辑:我还需要能够非常准确地放置带有中心点的标签。
最佳答案
两者都应该没问题。我会先制作一个 CSS3 的，然后只有在不满意的情况下才制作一个 Canvas 的。一些注意事项:
- 截至目前，对于许多浏览器而言，DOM 中的文本看起来比 Canvas 中的文本好得多。一些浏览器不会在 Canvas 文本上进行亚像素渲染(而其他浏览器会)，这使得在 DOM 和 Canvas 中以相同字体编写的内容看起来非常不同。为了视觉一致性，CSS3 现在更好。
- 如果有的话，问问自己以后您可能想用它做什么。将其高度互动？将对象数量增加到 10,000 个以上？然后你会想要做 Canvas，简而言之，因为 10,000 个 DOM 对象是一件“坏事”。
- 我不确定如果只有 100 个文本标签，哪个会更快。在您的目标平台上编写一个快速测试应该不难。
- CSS 的制作速度可能会快得多。
- Canvas 文本渐变不适用于所有移动设备，我上次检查过
- Canvas 文本旋转 + 缩放过去在 Chrome 和 Opera 中看起来很糟糕。 Chrome 从第 12 版开始修复了它，Opera 看起来仍然很糟糕。您可以在此处检查您的目标浏览器:http://simonsarris.com/misc/scaleText.html Opera 有点像 this .
关于html - 用于文本旋转的 CSS3 与 Canvas，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7205165/