我有两个 <a>在<p>我想在选择时为它们分配不同的边框。
当用户点击 <a> JavaScript 将类设置为 "selected"如果它是第一个，边框将变为绿色 <a>但如果第二个<a>单击并分配 class="selected"边框应变为红色。
我想用 CSS 做的是这样的:
a:first-child.selected {border-color:green}
a.selected {border-color:red}
但这不起作用。
有很多示例描述了如何选择特定类的第一个子节点，但没有描述如何选择某个标签的第一个子节点(如果它具有特定类)。
这有可能实现吗？
我现在所做的是设置第一个 <a>作为class="yesselected"如果单击第二个，它将显示 class="noselected" .
但我真的很想知道是否可以选择一个标签，如果它是第一个标签并且它具有特定的类
最佳答案
我本来以为你的 css 有点不对劲，你需要最后的伪元素。在伪类的情况下，这似乎是错误的。感谢@BoltClock 的独 Angular 兽
a.selected:first-child {border-color:green}
a.selected {border-color:red}
但是我不得不问一下，您的 css 是否将边框设置为出现在其他地方以及所有需要的边框值声明？
a{border: 1px solid transparent;}
a.selected:first-child {border-color:green}
a.selected {border-color:red}
关于html - CSS，选择 if :first-child has class ="selected"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20126882/