Question

我真的很努力寻找一种方法来为每个类别链接设置不同的颜色。

所以我创建了一个带有3个类别标签的帖子，例如“食物”，“饮料”和“乐趣”

在新闻页面上显示了我所有的不同帖子，其中包含指向我创建的每个类别的可点击链接。假设我希望食物标签为绿色，饮料标签为蓝色。我似乎无法找到该怎么做？

当我检查该元素时，它显示：<a href="http://localhost/domain/?cat=19" rel="category">food</a>代表食物，<a href="http://localhost/domain/?cat=20" rel="category">drink</a>代表饮料。

没有类，因此我可以在样式表中分别定位每个类。有什么想法可以分别设置样式吗？

非常感谢

Answer 1

有不同的解决方案，可以为没有类的元素提供单独的样式。其中之一是通过其父元素计算子元素。看起来如何？

CSS

.post-categories > li:first-child > a {
    color: red;
}

.post-categories > li:nth-child(2) > a {
    color: blue;
}

因此，对于第一个孩子，请在每个:first-child之后使用伪选择器:nth-child(#)和，在其中添加＃的数字。

这是另一种解决方案：

a[href="http://localhost/domain/?cat=19"] {
    color: red;
}

a[href="http://localhost/domain/?cat=20"] {
    color: blue;
}

但是，这要求DOM提供更多内容来搜索您的页面，检查每个锚点是否匹配href。第一种方法是使用户更友好。

给锚元素没有类的特定风格

1 个答案: