有没有办法在两个兄弟姐妹之间应用CSS样式？

因此,在上面的代码片段中,我想将CSS样式应用于活动月份,以及介于两者之间的所有月份.这在CSS中是否可行,或者我最好使用JS？

编辑:

这不起作用,但我认为它可能在正确的轨道上.

.month.active ~ .month {
    background-color: $color-lighter-text;
    color: #fff;
}

.month.active:nth-child(2) ~ .month {
    background-color: #fff !important;
    color: $color-muted-text !important;
}

Josh Crozier.. 7

您可以选择第一个.month元素后面的所有.active元素,然后通过选择.month第二个元素后面的所有元素来覆盖该样式.active:

.month.active ~ .month,
.active {
  color: #f00;
}
.month.active ~ .month.active ~ .month {
  color: initial;
}

Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec

$('.month.active:first').nextUntil('.active').addClass('active');

$('.month.active:first').nextUntil('.active').addClass('active');

.month.active {
  color: #f00;
}

Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec

.month.active ~ .month,
.active {
  color: #f00;
}
.month.active ~ .month.active ~ .month {
  color: initial;
}

Jan
Feb
Mar
Apr
May
Jun
Jul
Aug
Sep
Oct
Nov
Dec