CSS polygon() ພາສານີ້ທີ່ສະໜັບສະໜູນພາສານີ້.

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

CSS polygon() CSS polygon() ພາສານີ້ທີ່ສະໜັບສະໜູນພາສານີ້.

polygon() ພາສານີ້ທີ່ສະໜັບສະໜູນພາສານີ້. clip-path ສັນຍານພຽງພໍ shape-outside ການນຳໃຊ້ສັນຍານພຽງພໍ.

ຕົວຢ່າງ

ຕົວຢ່າງ 1

ຕັດຕິດຕາມບົດບາດ:

img {
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

ທົດລອງດີຕະຫຼອດຂອງທ່ານ

ຕົວຢ່າງ 2

ຕັດຕິດຕາມບົດບາດ:

img {
  clip-path: polygon(100% 0%, 50% 50%, 100% 100%);
}

ທົດລອງດີຕະຫຼອດຂອງທ່ານ

ຕົວຢ່າງ 3

ນຳໃຊ້ polygon()ຫຼືclip-path ແລະ shape-outside:

img {
  float: left;
  clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  shape-outside: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

ທົດລອງດີຕະຫຼອດຂອງທ່ານ

ຄຳສັບພາສາ CSS

polygon(fill-rule, length-percentage)
ຈຳນວນມູນ ການອະທິບາຍ
fill-rule

ທາງເລືອກ. ກໍານົດກົດລະບຽບການບັນຈຸ. ສາມາດເປັນ nonzero ຫຼື evenodd.

ຈຳນວນສົງຄາມແມ່ນ nonzero.
length-percentage

ຕ້ອງການ. ກໍານົດຈຸດທີ່ສະແດງບົດບາດ. ສາມາດເປັນຈຳນວນຫຼັກກຳນົດຫຼືສາມາດເປັນສາມາດສາມາດສາມາດສາມາດ.

ຕອນນັ້ນມີຈຳນວນບັນດາຈຸດທີ່ສະແດງຈາກຄູ່ມື x ແລະ y. 0 0 ສະແດງປະຕູສັ້ນທາງທີ່ຕາງຂວາງ, 100% 100% ສະແດງປະຕູສັ້ນທາງທີ່ຕາງລຸ່ມ.

ລະອຽດເຕັກນິກ

ລະບົບສະຖານະ: CSS Shape Module Level 1

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

ຈຳນວນບັນດາສັນຍານໃນຕາລະບັນດາສັນຍານທີ່ສະໜັບສະໜູນພາສານີ້ຄັ້ງທຳອິດ.

Chrome Edge Firefox Safari Opera
37 79 54 10.1 24

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

参考：clip-path ປະກອບມະນຸດ

参考：shape-outside ປະກອບມະນຸດ

参考：circle() 函数

参考：ellipse() 函数

参考：inset() 函数