Html CSS3与用于文本旋转的画布

我想做一个简单的技术演示。它将有一个很好的数量，可能多达100个，不同的文本标签，具有不同的旋转和Z顺序。此外，将有恒定的动画，因此标签的大小、旋转和位置将发生变化

据我所知，这可以使用CSS3或Canvas来完成。CSS3方法应该更容易接近，但是还有其他真正的差异需要考虑吗？

---

编辑：我还需要能够非常准确地放置标签的中心点。

两者都可以。我会先做一个CSS3，然后只在不满意的情况下做一个画布。一些考虑：

• 到目前为止，对于许多浏览器来说，DOM中的文本看起来比画布上的文本要好得多。一些浏览器不在画布文本上进行亚像素渲染（而其他浏览器则这样做），这使得在DOM中以相同字体编写的文本与在画布中编写的文本看起来非常不同。对于视觉一致性，CSS3现在更好
• 问问自己，如果有什么需要的话，你以后可能会想用它做什么。把它变成高度互动的？将对象数增加到10000以上？然后，您将需要使用Canvas，简而言之，因为10000个DOM对象是一件“坏事”
• 我不确定哪一个会更快，只有100个文本标签。在您的目标平台上编写一个快速测试来查看应该不难
• CSS的一个可能会更快
• 画布文本渐变在我上次检查的所有移动设备上都不起作用
• 画布文本旋转+缩放在Chrome和Opera中看起来很糟糕。Chrome从第12版开始修复，Opera看起来仍然很糟糕。你可以在这里查看你的目标浏览器：Opera有点像

---

而CSS3将是最好的解决方案，你也应该至少考虑SVG。 请参阅一个实例：
p、 美国：画布的负号很大，因为它没有文本选择