您可以使用 CSS 来选择段落中的字符串并设置其样式吗？答案

【问题标题】：Can you use CSS to select and style a string inside a paragraph(s)?您可以使用 CSS 来选择段落中的字符串并设置其样式吗？
【发布时间】：2012-03-26 01:37:47
【问题描述】：

是否可以仅使用 css 来挑选段落中的特定单词并为其设置样式？因此，例如在句子“hello my name is nick, hello to you all”中，是否可以将“hello”这个词定位在它出现的任何地方并添加规则，例如随时更改 hello 的颜色？我不想在出现的每个 hello 周围都添加一个 span 标签。

如果可能，我只想在 CSS 中执行此操作。 css3 很好用。

【问题讨论】：

stackoverflow.com/questions/1275776/…
我怀疑这是可能的，但我期待着您可能会得到创造性的答案。
您不想使用<span>？好吧，你很幸运，你可以使用<mark>！

标签： css css-selectors

【解决方案1】：

如其他人所说，要对任何特定单词或片段进行精细控制，您必须将其包装到一个跨度中并设置该跨度的样式。

不过，还有 :first-line 和 :first-letter 伪元素，自 CSS2 起可用。因此，例如，您可以让第一个字母具有不同的字体大小，并且整个第一行具有不同的颜色，例如 this：

p:first-letter {font-size: 30px;}
p:first-line {color: #FF0000;}

【讨论】：

这些不是伪类，它们是伪元素。这些从 CSS1 的平静时代就已经可用（尽管直到 IE5.5 才支持），因此是同类中的前两个。 CSS2 中引入的伪元素是:before 和:after。
感谢您的信息！我一直对伪类与-元素的命名感到困惑。现在我阅读了规格。 CSS1 specs 的信息不是很丰富，但CSS2 specs 很清楚。

【解决方案2】：

CSS 有 2* 伪元素：

::first-line 和 ::first-letter。这些是仅针对 Tag 的一部分 innerhtml 的唯一可能性。

(*ofc 它有更多，我的意思是只选择innerhtml的一部分。)

【讨论】：

【解决方案3】：

如果您知道 para 的内容并且有耐心，您可以将需要突出显示的每个单词都包含在 span 标签中。为它们分配相同的类，然后设置样式。

【讨论】：

【解决方案4】：

CSS 选择器适用于标签或伪类，而不是查询您的文本。检查参考http://www.w3.org/TR/selectors/，也许你可以在这里找到有用的东西。

【讨论】：

【解决方案5】：

我知道它不可能以 textnode 为目标，您可以使用 Javascript 来实现。用 span 标签包裹 Hello 词，并将属性设置为 SPAN 标签

【讨论】：

【解决方案6】：

不，您需要为此使用 javascript。或者，如果您使用 PHP/ASP...等，您可以在页面呈现之前自动在任何指定的单词周围添加跨度。

【讨论】：

谢谢 - 最终使用 PHP 并进行查找/替换，将单词替换为单词加上跨度标签，就像你建议的那样 :)
很高兴为您提供帮助！如果此答案回答了您的问题，请不要忘记将其标记为答案，以帮助以后找到您问题的用户。