如何让文本元素显示“<”

Question

我当前正在绘制 SVG，并且想要一个包含小于符号的文本元素。当我尝试时：

<svg xmlns="http://www.w3.org/2000/svg">
  <text x="40" y="40" fill="Black" font-size="25" font-weight="bold" font-family="courier new" ><</text>
</svg>

我收到以下错误：“StartTag：无效的元素名称”

Answer 1

和字符是 HTML 和 SVG 中<的>特殊字符，用于表示标签，例如<svg>和<text>。当您在代码中使用 时，渲染器认为您正在尝试启动一个新标签<。这就是您收到错误的原因"StartTag: invalid element name"

要告诉渲染器您要打印<字符而不是开始标记，您需要使用“转义码”。在这种情况下，您想要的转义码是<

<svg xmlns="http://www.w3.org/2000/svg">
    <text x="40" y="40" fill="Black" font-size="25" font-weight="bold" font-family="courier new" >&lt;</text>
</svg>

这是一个 jsFiddle演示了该转义代码的用法。

您还可以使用许多其他转义码。如果您的键盘缺少某些特殊字符（例如英镑），或者您想要输出特殊字符而不影响渲染器解析 HTML 或 SVG 的方式，那么它们会很有用。