Question

我正在写一个关于编程的博主。我希望它能自动更改特定字符的颜色，而无需手动将类或ID放入其中。例如，

 <blockquote class="tr_bq">
 <span style="color: #bb60d5;">$</span>
 <span>php app/console doctrine:schema:create</span>
 </blockquote>

当我将"$"字符放入blockquote tag时，它会自动添加color: #bb60d5来更改其颜色。

有办法吗？

Answer 1

使用CSS无法做到这一点，但是你可以使用javascript在加载时扫描页面并用你的自定义样式包装$的所有实例，这里是使用jQuery的实现：

$('blockquote').each(function () {
    $(this).html($(this).html().replace(/(\$)/g, '<span style="color: #bb60d5;">$1</span>'));
});

Answer 2

CSS无法找到与之相关的单词或其他内容，也无法自动添加颜色或应用样式。

您可以使用JavaScript，或者您可以使用某些服务器端编码来找出这个单词'$'并将一些样式应用于该div。例如：

<div style="color: red;">
 $<span style="color: black">php app/console doctrine:schema:create</span>
</div>

当您知道服务器将读取文件时，这将起作用，在ASP中您可以使用string.Split()来查找某些部分。您可以使用Regex，对于PHP，您可能需要搜索！

但它不适用于CSS，它只是JavaScript或服务器端。您可以使用CSS只应用颜色，或者只在每个元素中使用style。

Answer 3

我知道你的问题是关于CSS的，但jQuery可能是适合它的工具。你可以看看它。

if( $("blockquote").children("span:contains('$')").length ){
    $("blockquote span:nth-child(1)").css("color", "#bb60d5");
}