clip-path
Elemanı geometrik bir şekle göre keser. Kesilen bölge hem görünmez olur hem tıklamayı geçirmez.
Katalogdaki 512 efekt bu özelliği kullanıyor.
Sözdizimi
clip-path: circle(50%) | polygon(...) | inset(...) | path('...');Dikkat
Animasyonlanabilmesi için başlangıç ve bitiş şeklinin aynı türde ve aynı sayıda noktaya sahip olması gerekir. Üçgenden kareye geçiş için üçgeni dört noktayla (ikisi üst üste) yazmak gerekir.
Sık kullanılan değerler
circle(40% at 50% 50%)- Daire
polygon(50% 0%, 100% 100%, 0% 100%)- Üçgen — köşe listesi
inset(10px round 12px)- Kenarlardan içe kırpma
clip-path kullanan efektler
Katalogda ara Hepsi çalışan gerçek efektler. Kartın üzerine gel, kaynağını görmek için aç.