css - 使用 CSS 绘制曲线文字

Question

我想知道如何仅使用 CSS 绘制这种样式( flex )的文本请帮助我

Answer 1

这不是很简单，但我想这是可以做到的。看看这篇文章:Set Text on a Circle .不是完全相同的东西，而是相同的想法。您需要针对每个字符或每个单词部分执行此操作。

一个可能更简单的解决方案是使用 Javascript/jQuery。但我知道这不符合您对 CSS 的唯一要求。考虑查看 ArcText.js如果您觉得 CSS 不适合您，可以作为一种选择。

还有一个工具可以为您执行此操作:CSS Warp - CSS Text to Path Generator .这将完全匹配您想要的内容，并为您生成适用于各种浏览器的代码。我以前从未使用过它，但看起来几乎是万无一失的。

这是一个使用 CSS Warp 的例子。我花了大约 5 分钟。它让你非常接近你想要的东西，你可以进一步完善它。然后只需使用 CSS 添加其余的样式。