ປະກາດຄູ່ມູນ :active

定义和用法

CSS :active ພະຍາຍາມນຳໃຊ້ຂອງ CSS ເພື່ອເລືອກແລະກະກຽມການຈັດການທາງໃສ່ປະກອບທີ່ກຳລັງກະຕຸ້ນ.

:active ການນຳໃຊ້ຂອງພະຍາຍາມ <a> ແລະ <button> ປະກອບ. ເມື່ອຜູ້ນຳໃຊ້ກຳລັງກະຕຸ້ນທາຍ, ທາຍຈະຖືກກະຕຸ້ນ; ບັນນິວບັນດາກະຕຸ້ນຍັງຢືນຢັນ.

ຄຳແນະນຳ:ນຳໃຊ້ :link ການກະກຽມທາງໃສ່ທາຍທີ່ບໍ່ໄດ້ຢ້ຽມຢາມ, ນຳໃຊ້ :visited ການກະກຽມທາງໃສ່ທາຍທີ່ໄດ້ຢ້ຽມຢາມບັນດາບັນຊີທາຍ, ນຳໃຊ້ :hover ການກະກຽມການຈັດການທາງໃສ່ທາຍທີ່ຫົກຈອນ.

ເຫັນ:ໃນການກະກຽມ CSS:active ຕ້ອງຖືກວາງຂຶ້ນ :hover(ຖ້າມີ) ກໍ່ຕາມຈະມີຜົນງານ!

ບົດສະຫລຸບ

ຕົວຢ່າງ 1

ການເລືອກແລະກະກຽມການຈັດການທາງໃສ່ທາຍທີ່ກຳລັງກະຕຸ້ນ:

a:active {
  background-color: yellow;
}

ການທົດລອງເອງ

ຕົວຢ່າງ 2

ການເລືອກແລະກະກຽມການຈັດການທາງໃສ່ບັນດາປະກອບ <button> ທີ່ກຳລັງກະຕຸ້ນ:

button:active {
  background-color: pink;
}

ການທົດລອງເອງ

ຕົວຢ່າງ 3

ການເລືອກແລະກະກຽມການຈັດການທາງໃສ່ບັນດາປະກອບ <p>, <h1>, ແລະ <a> ທີ່ກຳລັງກະຕຸ້ນ:

p:active, h1:active, a:active {
  background-color: yellow;
}

ການທົດລອງເອງ

ຕົວຢ່າງ 4

ການເລືອກແລະກະກຽມການຈັດການທາງໃສ່ທາຍທີ່ບໍ່ໄດ້ຢ້ຽມຢາມ, ໄດ້ຢ້ຽມຢາມ, ຫົກຈອນ, ແລະ ກຳລັງກະຕຸ້ນ:

/* ທາຍທີ່ບໍ່ໄດ້ຢ້ຽມຢາມ */
a:link {
  color: green;
}
/* ທາຍທີ່ໄດ້ຢ້ຽມຢາມ */
a:visited {
  color: green;
}
/* ທາຍທີ່ກຳລັງຫົກຈອນ */
a:hover {
  color: red;
}
/* ທາຍທີ່ກຳລັງກະຕຸ້ນ */
a:active {
  color: yellow;
}

ການທົດລອງເອງ

ຕົວຢ່າງ 5

ການກະກຽມການຈັດການທາງໃສ່ທາຍ:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

ການທົດລອງເອງ

ການດັດນິນ CSS

:active {
  ການສະແດງ css;
}

ຂໍ້ມູນພື້ນຖານເຕັກນິກ

ລະບົບ: CSS1

ການສະໜັບສະໜູນບັນດາຄອມພິວເຕີ້

ຈຳນວນບັນທຶກໃນຕາລະບັນດາຄອມພິວເຕີ້ສະແດງວ່າຄວາມສະຫມັກຢ່າງເຕັມພາບຂອງພະຍາຍາມນັ້ນທຳອິດຂອງບັນດາຄອມພິວເຕີ້.

Chrome Edge Firefox Safari Opera
4.0 7.0 2.0 3.1 9.6

ບັນດາບັນຊີຂ້າງຊາຍ

ການສອນ:CSS ທາຍ

ການສອນ:CSS ບັນນາທິດ

ການສອນ:CSS ແບບພະຍາຍາມ