Bolehkah Anda Kini Sarang Kelas CSS?

Kelas CSS Bersarang: Kini Dimungkinkan

Dalam versi CSS sebelum ini, idea kelas bersarang sukar difahami. Pembangun terpaksa menggunakan teknik yang lebih kompleks untuk mencapai kesan yang sama. Walau bagaimanapun, Modul Bersarang CSS telah membuka kemungkinan baharu.

Bolehkah Anda Menetapkan Kelas CSS?

Jawapannya ialah "ya." Dengan Modul Bersarang CSS, anda boleh menerima sintaks berikut:

.class1 {
  some stuff;
}

.class2 {
  .class1;
  some more stuff;
}

Sintaks ini membolehkan anda menyusun kelas, mencipta struktur hierarki.

Sampel Pelaksanaan

Berikut ialah beberapa contoh yang mempamerkan kuasa CSS bersarang:

table.colortable {
  & td {
    text-align: center;
    &.c { text-transform: uppercase }
    &:first-child, &:first-child + td { border: 1px solid black }
  }

  & th {
    text-align: center;
    background: black;
    color: white;
  }
}

.foo {
  color: red;
  @nest & > .bar {
    color: blue;
  }
}

.foo {
  color: red;
  @nest .parent & {
    color: blue;
  }
}

Dengan CSS bersarang, anda kini boleh menulis helaian gaya yang lebih ringkas dan boleh diselenggara. Nikmati peningkatan fleksibiliti dan struktur semantik yang disediakannya.

Atas ialah kandungan terperinci Bolehkah Anda Kini Sarang Kelas CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!