更改最后一个字母的颜色

Question

示例代码：

<p class="test">string</p>

我想更改最后一个字母的颜色，在这种情况下为“ g”，但我需要使用CSS的解决方案，不需要JavaScript解决方案。

我逐个字母显示字符串，我不能使用静态解决方案。

Answer 1

不使用JavaScript，您唯一的选择是：

<p class="test">strin<span class="other-color">g</span></p>

编辑您的小提琴链接 ：

我不太确定为什么您说您不需要JavaScript解决方案，因为您已经有了很多解决方案。无论如何，在此示例中，您只需要进行一些小更改。将第10行从

elem.text(elem.text() + contentArray[current++]);

至

if ( current == contentArray.length-1 ) {
    elem.html(elem.html() + "<span style='color:red'>"+contentArray[current++]+"</span>");
} else {
    elem.html(elem.html() + contentArray[current++]);
}

需要注意的是它使用的是非常重要的.html()，而不是.text()现在，因为有实际被插入HTML标记。