如何在simple_form标签中插入<sup>标签实现上标显示效果？

要在Simple Form的标签里插入<sup>2</sup>并让它正确渲染，核心是关闭标签文本的HTML转义——因为Simple Form默认会转义所有HTML内容，直接写标签会被当成普通文本显示。你可以这样修改代码：

<%= f.input :meters, label: "Meters (m<sup>2</sup>)", placeholder: "Meters", label_html: { escape: false } %>

label_html: { escape: false }这个配置会告诉Simple Form不要转义标签里的HTML代码，这样<sup>2</sup>就能被浏览器解析成上标效果，最终显示为Meters (m²)。

另外也可以用raw方法直接处理标签文本，效果是一样的：

<%= f.input :meters, label: raw("Meters (m<sup>2</sup>)"), placeholder: "Meters" %>

两种方法任选其一即可。

内容的提问来源于stack exchange，提问作者Andres