在 html 代码标签中设置文本样式答案

【问题标题】：Styling text in html code tag在 html 代码标签中设置文本样式
【发布时间】：2012-05-08 13:50:47
【问题描述】：

我想设置一些文本的样式，它被包裹在一个 html <code> 标记中。但是样式是在服务器端类中完成的。例如：

myValue.replaceAll(" " + textToStyle + " ", " <span style=\"color: orange;\"> " + textToStyle + "</span> ");

此行作为包含在<code> 标记中的文本。文本显示在 JSF 数据表中：

<h:column>
    <code class="dt_row">
        #{myList.myValue}
    </code>
</h:column>

<code>标签css类：

.dt_row {
    height: 8px;
    margin: 3px 3px 3px 3px;
    color: #000000;
    font-size: 12px;
}

问题是当 html 在浏览器中呈现时，代码会显示所有标签。我希望这个<span style=\"color: orange;\"> 不会显示在页面中，而是橙色的文本值。

有什么想法可以实现吗？

【问题讨论】：

【解决方案1】：

而不是

#{myList.myValue}

你可以试试

<h:outputText value="#{myList.myValue}" escape="false" />

将“escape”设置为 false 应该可以完成工作（否则框架将转义字符串...）。

【讨论】：

【解决方案2】：

更优雅的方法是使用 h:outputText 组件的样式属性并引用 bean 的颜色，例如：

<h:column>
    <code class="dt_row">
        <h:outputText value="#{myList.myValue}" style="color: #{myList.color};" />
    </code>
</h:column>

【讨论】：

实际上这个解决方案要优雅得多。并且可能会在生产环境中采用。
是的，我同意，如果您想突出显示来自 myList.myValue 的所有值。但在我的情况下，该值包含多个单词，但只需要突出显示一个特定的单词。所以以前的解决方案最适合我。