ວິທີການປິດຄະແນນຄໍ້າກະແຈາງ

ຮຽນວິທີການປິດຄະແນນຄໍ້າກະແຈາງ ທີ່ໃຊ້ CSS.

ວິທີການປິດຄະແນນຄໍ້າກະແຈາງ

ເພີ່ມ overflow: hidden;ທີ່ຈະປິດຄະແນນຄໍ້າກະແຈາງທີ່ທຳມະດາ, ຈະປິດຄະແນນຄໍ້າກະແຈາງທີ່ທຳມະດາ.

ຄວາມຄົງທີ່

body {
  overflow: hidden; /* Hide scrollbars */
}

ທ້າທາຍຄັດທີ່ເຈົ້າຈະທ້າທາຍ

ທີ່ຈະປິດຄະແນນຄໍ້າກະແຈາງທີ່ທຳມະດາ ຫຼື ພຽງພໍຄະແນນຄໍ້າກະແຈາງທີ່ທຳມະດາ, ຈະໃຊ້ overflow-y ຫຼື overflow-x:

ຄວາມຄົງທີ່

body {
  overflow-y: hidden; /* Hide vertical scrollbar */
  overflow-x: hidden; /* Hide horizontal scrollbar */
}

ທ້າທາຍຄັດທີ່ເຈົ້າຈະທ້າທາຍ

ບໍ່ມີຫຍັງ:overflow:hidden ຈະລົບລ້າງການປະຕິບັດຄະແນນຄໍ້າກະແຈາງ. ບໍ່ສາມາດກະແຈາງຕາມບາງບ່ອນໃນໜ້າວາງ.

ປິດຄະແນນຄໍ້າກະແຈາງ ແຕ່ຍັງບໍ່ປິດການປະຕິບັດ

ທີ່ຈະປິດຄະແນນຄໍ້າກະແຈາງ ແຕ່ຍັງຈະສາມາດກະແຈາງຕາມການ, ສາມາດໃຊ້ລະບົບທີ່ຫຼັງນີ້:

ຄວາມຄົງທີ່

/* ປິດຄະແນນຄໍ້າກະແຈາງ ສໍາລັບ Chrome, Safari ແລະ Opera */
.example::-webkit-scrollbar {
  display: none;
}
/* ປິດຄະແນນຄໍ້າກະແຈາງ ສໍາລັບ IE, Edge ແລະ Firefox */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

ທ້າທາຍຄັດທີ່ເຈົ້າຈະທ້າທາຍ

Webkit ບັນຊີຍາການ (ເຊັ່ນ Chrome, Safari ແລະ Opera) ສະໜັບສະໜູນ ປະກອງບໍ່ປົກກະຕິ ::-webkit-scrollbar ສັບສິນ, ຈະອະນຸຍາດພວກເຮົາດັດແປງພາບຄະແນນຄໍ້າກະແຈາງຂອງບັນຊີຍາການ. IE ແລະ Edge ສະໜັບສະໜູນ -ms-overflow-style: ປະກອງ, Firefox ສະໜັບສະໜູນ scrollbar-width ປະກອບປະກອງ, ທີ່ຈະອະນຸຍາດພວກເຮົາປິດຄະແນນຄໍ້າກະແຈາງແຕ່ຍັງບໍ່ປິດການປະຕິບັດ.

ບັນດາໜ້າທີ່ກ່ຽວຂ້ອງ

ຄູ່ມວນຊົນ：CSS 溢出

参考手册：CSS overflow 属性