Selector Penampang CSS (&)

Definisi dan Penggunaan

CSS Penampang (&) Selector digunakan untuk menerapkan gaya bagi elemen dalam konteks elemen lain.

Penampang mengurangi kebutuhan untuk menggunakan selector berulang-ulang untuk elemen yang relevan.

Contoh

Contoh 1

Sebelum disampingkan, Anda harus mengumumkan masing-masing selector secara eksplisit, seperti yang ditunjukkan di bawah ini:

.box {
  border: 2px solid green;
  background-color: krim;
  font-family: monospace;
  font-size: 20px;
}
.box > a {
  color: hijau;
}
.box > a:hover {
  color: putih;
  background-color: salmon;
}

Coba sendiri

Contoh 2

Setelah disampingkan, selector di lanjutkan, dan aturan gaya yang relevan di kelompokkan dalam aturan utama:

.box {
  border: 2px solid green;
  background-color: krim;
  font-family: monospace;
  font-size: 20px;
  & > a {
    color: hijau;
    &:hover {
      color: putih;
      background-color: salmon;
    }
  }
}

Coba sendiri

Petunjuk:Jika gaya .box di contoh sebelumnya harus dihapus dari proyek Anda, Anda dapat menghapus seluruh grup tanpa mencari selector yang relevan.

Syarat CSS

aturutama {
  deklarasi css;
  & aturputri {
    deklarasi css;  } 
}

Detil Teknologi

Dukungan Peramban