Question

我有<p>Example string</p>里面有一些文字。我想用css在该段落中搜索一个单词。

我知道如果你有例如这是可能的<a href="test"></a>您所要做的就是：

a[href*="test"]{}

但是当我尝试用我的段落做这件事时，我似乎无法让它发挥作用。我试过了：

[p*="string"]{}

p[*="string"]{}

Answer 1

简短的回答是 NO ，这不可能仅使用CSS，您使用的是element[attr=val]选择器，它只选择具有该特定值的特定属性的元素。您需要使用带有正则表达式的jQuery或Javascript来跟踪模式并将样式应用于其元素。

另一方面，您可以创建前缀为data-的自定义属性，例如，您可以执行类似

的操作

<p data-custom="Holder Text">Want to change this</p>
<p data-custom="Holder Text">Want to change this</p>
<p data-custom="Holder Text 2">Dont Touch This</p>

p[data-custom="Holder Text"] {
   color: red;
}

Demo

但同样，这里没有意义，如果您知道需要更改哪些元素，您可以简单地分配类。

Answer 2

你不能只使用CSS，但你可以检查this blog post如何使用jQuery实现这一点。

基本上你应该使用:contains选择器：

$("p:contains('John')")

使用CSS在子段内匹配

2 个答案: