我想风格最后一个/第二个。
<ul> <li class="heading">Hello world</li> <li>Hello world</li> <li>Hello world</li> <li class="heading">Hello world</li> <li>Hello world</li> </ul>
也不
ul li.heading:last-child { background: black; }
也不
ul li.heading:nth-child(2) { background: black; }
为我工作为什么,如何应用样式到< li>?似乎伪类选择器不适用于类选择器。这是奇怪的,因为我可以发誓我以前使用过。
更新:哎呀,完全忘了the jsfiddle。
解决方法
你的说法是:“我想要风格最后一个/第二个。”
这意味着你必须像这样写你的代码:
<ul> <li class="heading">Hello world</li> <li class="heading">Hello world</li> <li class="heading">Hello world</li> <li class="heading">Hello world</li> <li class="heading">Hello world</li> </ul>
和CSS:
ul li.heading:last-child { background: black; } ul li.heading:nth-child(2) { background: black; }
否则,使用你当前的HTML代码,你会写:
ul li.heading:nth-child(4) { background: black; } ul li.heading:nth-child(1) { background: black; }
我明白你的想法,但是与“课程”类似的lis不是第二个还是最后一个孩子。