Die Verbinding van Selekteerders in LESS

Soms het ons nodig dat geneste strukture tydens kompilering nie met 'n spasie verbind word nie, maar aaneen. Om dit te doen, moet 'n ampersand voor die naam van die geneste selekteerder geplaas word:

styles.lessdiv {
  &.block {
    width: 300px;
  }
}

As gevolg hiervan sal die volgende kode na kompilering verkry word:

styles.cssdiv.block {
  width: 300px;
}
Задание 1

Verduidelik wat die resultaat van die kompilering van die volgende kode sal wees:

styles.less#block {
  &.xxx {
    width: 300px;
  }
}
Задание 2

Verduidelik wat die resultaat van die kompilering van die volgende kode sal wees:

styles.less#block {
  .xxx {
    width: 300px;
  }
}
Задание 3

Verduidelik wat die resultaat van die kompilering van die volgende kode sal wees:

styles.less#block {
  &.xxx {
    &.zzz {
      width: 300px;
    }
  }
}
Задание 4

Verduidelik wat die resultaat van die kompilering van die volgende kode sal wees:

styles.less#block {
  &.xxx {
    .zzz {
      width: 300px;
    }
  }
}
Задание 5

Verduidelik wat die resultaat van die kompilering van die volgende kode sal wees:

styles.less#block {
  .xxx {
    &.zzz {
      width: 300px;
    }
  }
}