polygon()
CSS polygon() funksiyasi ko‘pburchakni (polygon) belgilaydi.
polygon() funksiyasi clip-path xususiyati va shape-outside xususiyati bilan ishlatiladi.
Misol
Rasmni ko‘pburchak shaklida qirqing:
img {
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}
O‘zingiz sinab ko‘ring »
Quyida ko‘proq "O‘zingiz sinab ko‘ring" misollari keltirilgan.
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi sonlar funksiyani to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Funksiya | |||||
|---|---|---|---|---|---|
| polygon() | 37 | 79 | 54 | 10.1 | 24 |
CSS sintaksisi
polygon(fill-rule, length-percentage)
| Qiymat | Tavsif |
|---|---|
| fill-rule | Ixtiyoriy. To‘ldirish qoidasini belgilaydi. nonzero yoki evenodd bo‘lishi mumkin. Standart qiymat: nonzero |
| length-percentage | Majburiy. Ko‘pburchakni belgilaydigan nuqtalarni belgilaydi. Bu uzunlik yoki foiz qiymati bo‘lishi mumkin. Har bir nuqta x va y koordinatalari juftligidan iborat. 0 0 chap yuqori burchakni, 100% 100% esa o‘ng pastki burchakni belgilaydi |
| Versiya: | CSS Shape moduli, 1-daraja |
|---|
Ko‘proq misollar
Misol
Rasmni ko‘pburchak shaklida qirqing:
img {
clip-path: polygon(100% 0%, 50% 50%, 100% 100%);
}
O‘zingiz sinab ko‘ring »
Misol
polygon(), clip-path va shape-outside’dan foydalanish:
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%);
}
O‘zingiz sinab ko‘ring »
CSS ma’lumotnomasi: clip-path xususiyati.
CSS ma’lumotnomasi: shape-outside xususiyati.
CSS ma’lumotnomasi: circle() funksiyasi.
CSS ma’lumotnomasi: ellipse() funksiyasi.
CSS ma’lumotnomasi: inset() funksiyasi.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!