ປະກອບປະກອບ @layer

ການອະທິບາຍແລະການນໍາໃຊ້

CSS @layer ກົດລະບຽບສາມາດນຳໃຊ້ເພື່ອຄວບຄຸມຊັ້ນລະບົບທີ່ສະຫຼັບ CSS (cascade layers) ທີ່ຈະຈັດຕັ້ງຈຸດການອະທິບາຍສັນວົງ.

ນີ້ຈະຮັບຜົນຈາກການອະທິບາຍຊັ້ນລະບົບວ່າຫຼັງຈາກນັ້ນຈະປິດລະບົບກົດລະບຽບທີ່ຕ້ອງກະຈັດຕາມຊັ້ນລະບົບສະເພາະ.

@layer ສາມາດມີຊື່ຫຼືບໍ່ມີຊື່.

ບໍ່ມີຊື່ @layer ຖືກເອີ້ນວ່າຊັ້ນທີ່ບໍ່ມີຊື່ຊັ້ນທີ່ບໍ່ມີຊື່ (ສາມາດມີຊື່ຫຼືບໍ່).

ທີ່ມີຊື່ທີ່ຫຼາຍຫຼາຍ @layer ຖືກເອີ້ນວ່າຊັ້ນຊື່ວ່າຜ່ານຊັ້ນຊື່ວ່າພວກເຮົາສາມາດກະຈັດຊັ້ນລະບົບທີ່ຫຼາຍຫຼາຍ (ຊົງຫຼັງຕົວຢ່າງໃນລາຍລະອຽດ). ລຳດັບຈະຕິດຕາມຈາກຫຼາຍສຸດເຖິງຫຼາຍສຸດ, ຈາກຊ້າຍໄປທາງຊາຍ.

ຄວາມຈຳນວນ

ຕົວຢ່າງ 1

ການນຳໃຊ້ຊັ້ນທີ່ບໍ່ມີຊື່ (ຈະຕິດຕາມກົດລະບຽບການລະບົບແບບຈົບໄປເວລາ):

/* ຊັ້ນ 1 */
@layer {
  body {
    background: pink;
  }
}
/* ຊັ້ນ 2 */
@layer {
  body {
    background: lightblue; /* ຊັ້ນສຸດທ້າຍກະທຳ */
  }
}

ທ້າທາຍຕະຫຼອດຈິງ.

ຕົວຢ່າງ 2

ການນຳໃຊ້ຊັ້ນຊື່ວ່າ (ແລະການກະຈັດຊັ້ນລະບົບທີ່ຫຼາຍຫຼາຍ):

/* ການກະຈັດຊັ້ນລະບົບທີ່ຫຼາຍຫຼາຍ */
@layer bgblue, bgpink;
/* ຊັ້ນ 1 */
@layer bgpink {
  body {
    background: pink; /* ການກະທຳ */
  }
}
/* ຊັ້ນ 2 */
@layer bgblue {
  body {
    background: lightblue;
  }
}

ທ້າທາຍຕະຫຼອດຈິງ.

ກົດລະບຽບ CSS

@layer name {
  ການອະທິບາຍ css;
}

ຄຸນພາກຂອງບັນດາປະສົມອາຊີບ

ການສະຫຼັບບັນຊີບັນຊາການອື່ນ.

ຈຳນວນທີ່ໃນຕາຕະລາງຈະສະແດງວ່າລະບົບທີ່ສົມບູນສະຫຼັບ @ ກົດລະບຽບນັ້ນ.