fungsi polygon() CSS

definisi dan penggunaan

CSS polygon() fungsi digunakan untuk mendefiniskan poligon.

polygon() fungsi dengan atur-laju-potong aturan dan atur-bahasa-luar aturkan bersama-sama.

contoh

contoh 1

potong gambar ke poligon:

img {
  atur-laju-potong: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

coba sendiri

contoh 2

potong gambar ke poligon:

img {
  atur-laju-potong: polygon(100% 0%, 50% 50%, 100% 100%);
}

coba sendiri

contoh 3

guna polygon()、atur-laju-potong dan atur-bahasa-luar:

img {
  gerak: kiri;
  atur-laju-potong: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
  atur-bahasa-luar: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

coba sendiri

gramatika CSS

polygon(atur-isian, length-percentage)
nilai deskripsi
atur-isian

pilihan. Tentukan atur isian. Ini boleh adalah nonzero atau evenodd.

nilai-default adalah nonzero.
length-percentage

diperlukan. Tentukan titik yang mendefiniskan poligon. Ini boleh jauh atau persen.

setiap titik adalah pasangan koordinat x dan y. 0 0 menentukan anggur kiri atas, 100% 100% menentukan kanan bawah.

detil-teknologi

versi: Modul Bentuk CSS Level 1

dukungan-pelayar

nombor dalam tabel menunjukkan versi pelayar yang sepenuhnya mendukung fungsi ini.

Chrome Edge Firefox Safari Opera
37 79 54 10.1 24

halaman-pautan

Rujukan:atur-laju-potong

Rujukan:atur-bahasa-luar

Rujukan:Fungsi circle()

Rujukan:Fungsi ellipse()

Rujukan:Fungsi inset()