ປະກອບຂອງບັນດາບັນຊີ CSS border-image-slice

ການລະບຸແລະການນໍາໃຊ້

border-image-slice 属性ອາດລະບຸຄວາມຫັງພາບຂອງຊາຍ.

ອີກຄົນບັງຄັບບວກ:

CSS3 教程：CSS3 ກາງກະບຽນ

ຕົວຢ່າງ

ການວາງຄວາມຫັງພາບຂອງຊາຍ:

div
{
border-image-source: url(border.png);
border-image-slice: 50% 50%;
}

CSS 语法

border-image-slice: number|%|fill;

ຄວາມຄິດເຫັນ:ບັນດາບັນດາບາດບັບນີ້ອາດລະບຸຄວາມຫັງຂອງພາບຂອງຊາຍທີ່ສາມາດ, ທາງພາກາວາງ, ທາງດ້ານລົງ, ແລະ ທາງພາກຂາດຂອງພາບ. ພາບຖືກແຍກສາຍເປັນສູນມິດ: ສີ່ຫົງ, ສີ່ທາງ, ແລະ ໜຶ່ງສູນມິດ. ຖ້າບໍ່ໃຊ້ບັນດາພາສາທີ່ອາດກວດມາໃນປະຈຳສາຍທີ່ສູນມິດ, ສ່ວນພາບຂອງສູນມິດຈະຖືກປະພຶດ. ຖ້າຫາກບໍ່ມີຈຳນວນທີ່ສີບສາມ, ຈະກວດມາໃນຈຳນວນທີ່ສີບສາມ. ຖ້າຫາກບໍ່ມີຈຳນວນທີ່ສີບ, ຈະກວດມາໃນຈຳນວນທີ່ສີບສາມ.

ມູນຄ່າຂອງບັນດາບັນດາບາດບັບ

ມູນຄ່າ ການອະທິບາຍ
number ຈຳນວນທີ່ຢູ່ໃນພາບ: ຈະຖືກສະແດງເປັນຄວາມຍາວຂອງພາບ(ຖ້າເປັນພາບຂັ້ນຕົ້ນ) ຫຼື ຄວາມຍາວຂອງຕາມຂອງພາບ(ຖ້າເປັນພາບຂັ້ນວິທະຍາສາດ).
% ຕາມຂະໜາດຂອງພາບທີ່ຕາມຂະໜາດຂອງພາບ: ຄວາມຍາວຂອງພາບອາດມີຜົນກະທົບຕໍ່ການກະຈາຍຕາມລະຫວ່າງສາຍທີ່ພູມມັດ, ຄວາມຍາວທີ່ພູມມັດອາດມີຜົນກະທົບຕໍ່ການກະຈາຍຕາມລະຫວ່າງສາຍທີ່ພູມມັດ.
fill ກັກຂວາງພາບຂອງຊາຍບອກກັນບໍ່ໄດ້.

ຂໍ້ມູນດ້ານເຕັກນິກ

ມູນຄ່າຄົງທີ່ເປັນການລະບຸບ: 100%
ການສືບທອດຢູ່ບັນດາບັນດາບາດບັບທີ່ອີກ: no
版本： CSS3
JavaScript 语法： object.style.borderImageSlice="50% 50%"

ການສະໜັບສະໜູນບັນດາບັນດາບາດບັບ

ຈຳນວນທີ່ຢູ່ໃນຕາຕະລາງອາດຊີ້ໃຫ້ຮູ້ວ່າບັນດາສາຍຄົ້ນສະແດງວ່າບັນດາສາຍທີ່ເບິ່ງວ່າມີການສະໜັບສະໜູນຄັບດັ່ງກ່າວທຳອິດຂອງບັນດາບັນດາບາດບັບໄດ້ຮັບການສະໜັບສະໜູນໄດ້ສົມບູນ.

Chrome IE / Edge Firefox Safari Opera
15.0 11.0 15.0 6.0 15.0

ບັງຄັບບວກ border-image ການລະບຸບ。