伪类：第一个孩子不工作

Question

我做错了吗？

CSS / SASS：

#section
  article
   border-top: 1px solid black
   &:first-child
     border: none !important

的HTML / HAML：

#section
  %h2 title
   %article
    stuff here. There is still a top border here despite first-child style.
   %article
    stuff here.
   %article
    stuff here.

这不起作用，并且第一个<article>上仍有边框。我必须在第一篇文章中创建另一个类并执行article.noborder之类的操作以获得无边框。任何帮助将不胜感激... css讨厌我。

Answer 1

由于第一个h2之前的article，您必须使用:first-of-type。

Answer 2

在我看来，H2是该部分的第一个孩子，而不是第一篇文章。

Answer 3

section article:first-child{
  border:none;
}

section article:nth-child(2){
  border:2px solid yellow;
}

我之前遇到过这个问题，试着记住不要用不同的方式来调用相同的元素。

如果您使用body section article { border:2px solid yellow}将重叠 section article:first-child{...}因为前一个更具体。