What does it mean in sass / scss "&"?

3

I found this in a sass/scss file of Bootstrap v4 :

.nav-pills {
  .nav-link {
    @include border-radius($nav-pills-border-radius);

    &.active,
    .show > & { /* <-- !!! */

      color: $nav-pills-link-active-color;
      background-color: $nav-pills-link-active-bg;
    }
  }
}

I know that & is normally referred to the parent selector (direct):

.clasePadre {

  &.claseHijo {

  }
}

Equals .clasePadre.claseHijo .

Then would it be in this case .show > & equivalent to .show > .nav-pills .nav-link ?

That is: Is all parent selectors inherited with & ?

    
asked by aldanux 02.10.2017 в 15:26
source

1 answer

6
  

So in this case it would be .show > & equivalent to .show > .nav-pills .nav-link?

Yes .

  

Is all parental selectors inherited with & ?

Yes .

According to the

answered by 02.10.2017 / 15:26
source