javascript - 有没有办法使用 CSS3/Canvas 来 flex/弧形文本

标签 javascript html canvas css

我正在尝试使用 CSS3、HTML Canvas 甚至 SVG 制作 flex 文本效果(例如参见下图)?这可能吗?如果可以的话,怎样才能达到这样的效果呢?

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

Arched or Curved Text Example

最佳答案

SVG 直接支持路径上的文本,但它不会沿路径“flex ”各个字形。这是an example如何创建它:

...
<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>
...

关于javascript - 有没有办法使用 CSS3/Canvas 来 flex/弧形文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5996145/

相关文章:

javascript - 使用 jquery 使动画异步/同步的干净方法

javascript - Angular Controller 作为语法,特殊场合还需要 $scope 吗?

javascript - 如何在初始化后动态更新Google可视化图表的工具提示?

html - 使用 CSS 旋转 div

javascript - 在圆圈下方绘制文字

javascript - Createjs 和 easlejs - 用多个点对一条线进行动画处理

javascript - 如果再次调用函数,则取消超时/计时器 --- debounce 函数

javascript - 在跟随鼠标指针的图像上制作轴引导线

javascript - 如何忽略innerHTML属性中的HTML标签?

android - 使用位图作为布局的 alpha