Penggabungan Urutan Pemilih dalam @extend di SASS

Jika kita perlu menggabungkan urutan pemilih, kita juga menggunakan arahan @extend:

Pertimbangkan contoh berikut:

style.scss#main .list p {
  font-weight: bold;
}
#sub .resume .link {
  @extend p;
}

Perhatikan kod yang telah disusun dalam fail css, apabila menggabungkan dua urutan yang tidak mempunyai pemilih yang sama, maka pemilih baru akan terbentuk secara automatik: satu dengan urutan pertama sebelum yang kedua dan satu dengan urutan kedua sebelum yang pertama:

style.css#main .list p,
#main .list #sub .resume .link, #sub .resume #main .list .link {
  font-weight: bold;
}

Dalam kes di mana urutan mempunyai pemilih yang sama, maka ia akan digabungkan bersama-sama dan hanya perbezaan yang akan berselang-seli (jika ada). Dalam contoh berikut, kedua-dua urutan mempunyai pengenal #main:

style.scss#main .list p {
  font-weight: semi-bold;
}
#main .resume .link {
  @extend p;
}

Hasil daripada penyusunan, kedua-dua pengenal ini akan digabungkan:

style.css#main .list p,
#main .list #sub .resume .link, #sub .resume #main .list .link {
  font-weight: bold;
}

styles.scssdiv p {
  font-size: 12px;
  padding-bottom: 4px;
}
link button #card-title {
  @extend p;
}