Question

在CSS中使用nth-of-type选择器对我不起作用。它将第一个孩子的风格应用于其他兄弟姐妹。那么所发生的是home-navigation-item所有的div都是有色的aqua。

   .home-navigation-item:nth-of-type(1) {
     background-color: aqua;
   }
   .home-navigation-item:nth-of-type(2) {
     background-color: red;
   }

<div class="home-navigation">
  <a href="news.html">
    <div class="home-navigation-item">NEWS</div>
  </a>
  <a href="announcements.html">
    <div class="home-navigation-item">ANNOUNCEMENTS</div>
  </a>
  <a href="events.html">
    <div class="home-navigation-item">SCHEDULE OF EVENTS</div>
  </a>

</div>

Answer 1

它没有工作，因为它有多个父级。 nth-of-type工作的直接兄弟姐妹不是他们的父母，而是兄弟姐妹。因此，最好将兄弟姐妹的父母和元素作为目标。 Read This

＆＃13;

segs <- data.frame(x = seq(2.5, 22.5, by = 5), 
                   ymax = tapply(a$y, a$z, max), 
                   ymin = tapply(a$y, a$z, min),
                   z = levels(a$z))

ggplot(a, aes(x=x, y=y, col=z)) + geom_point(size=3) + 
  geom_segment(aes(x = x, y = ymax, xend = x, yend = ymin, 
                   col = z), alpha = 0.3, size = 33, data = segs, show.legend = FALSE)

＆＃13;

.home-navigation a:nth-of-type(1) .home-navigation-item{
   background-color: aqua;
}

.home-navigation a:nth-of-type(2) .home-navigation-item{
   background-color:red;
}

＆＃13;

CSS nth-of-type无效

1 个答案: