有没有办法使用 CSS3/Canvas 来弯曲/弧形文本

Question

我正在尝试使用 CSS3、HTML Canvas 甚至 SVG 制作 弯曲的文本 效果（例如，请参见下图）？这可能吗？如果是这样，我怎样才能达到这种效果？

更新： 澄清一下：将以这种方式设置样式的文本将是动态的。

原文由 gabriel 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

SVG 直接支持路径上的文本，尽管它不会沿路径“弯曲”各个字形。以下是您如何创建它 的示例：

 ...
<defs>
  <path id="textPath" d="M10 50 C10 0 90 0 90 50"/>
</defs>
<text fill="red">
  <textPath xlink:href="#textPath">Text on a Path</textPath>
</text>
...

原文由 Phrogz 发布，翻译遵循 CC BY-SA 2.5 许可协议