CSS:选择包含特定单词的链接的第一个匹配项

莫非斯

想象下面的例子:

<a href="/test/test.html"></a>
<a href="/test/test.html"></a>
<a href="/test/test.html"></a>
**<a href="/info/test.html"></a>**
<a href="/info/test.html"></a>
<a href="/info/test.html"></a>

是否有可能获得第四项?

注意:我只需要CSS解决方案,因为我已经知道在JS中的工作方式。不能使用nth-childnth-of-type因为它可以在列表中的任何位置。所有链接只有一个包装容器。

这是我试图实现自己想要的方式:

a[href*="/info/"]:first-child:before {
    content: "Pages";
    display: block;
    width: 100%;
    background: #b1be2d;
    color: #fff;
    font-size: 120%; 
}
萨拉查

你不能那样做...

我不知道这是否对您有帮助,但是您可以使用通用的同级选择器选择不是第一次出现的所有人...这样,您就可以将第一次出现的样式与其他出现的样式区分开他们:

a[href*="/info/"] {
    /* style for every occurence */
}

a[href*="/info/"] ~ a[href*="/info/"] {
    /* style for every occurence that is not the first one */
}

JsFiddle示例

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Ruby str.match(regex)返回仅包含第一个匹配项的MatchData

使用awk匹配一个单词,然后找到另一个单词的第一个匹配项

CSS-选择第一个匹配的元素(而不是第一个子元素或第一个类型)

找到第一个匹配项后匹配特定的模式,并使它们之间的列相关

从列表中提取出现在特定单词之后的第一个元素

SQL:选择第一列的第一个匹配项,第二个值不同

正则表达式匹配包含特定单词的句子,如果包含另一个特定单词则放弃匹配

选择<P>中的第一个单词

提取文本列中特定单词之后的第一个数字

如何使用具有不同父项的CSS选择器获取第一个匹配元素?

选择数据框中带有前缀的变量的第一个匹配项

删除双向链接列表中的第一个匹配项

仅删除sed的第一个匹配项

CSS选择器,选择一个类,但该类的第一个匹配项除外

在Hive中选择表中的第一个匹配项

NSPredicate仅查找第一个匹配项

XSLT选择第一个匹配项

在包含“ [...]”的模式之后提取第一个单词

匹配单词的第一个字母

sed更改另一个匹配项的第一个匹配项

提取符合sed的第一个匹配项

提取特定单词之后的第一个单词

正则表达式 - 从 Javascript 代码中选择第一个匹配项

如何提取列中第一个出现的特定单词

Python:从包含特定单词的文本中选择一个子句

如何在数据框中的第一个特定单词之后找到第二个特定单词

正则表达式,在特定单词/Python 之后返回第一个匹配项

查找第一个包含来自数组的匹配项

根据列规则选择第一个匹配项