Apakah maksud skala css3?

Dalam CSS3, skala bermaksud "penskalaan" dan merupakan fungsi terbina dalam yang digunakan dalam atribut transformasi, yang digunakan untuk melakukan transformasi penskalaan 2D atau 3D pada elemen tertentu terdapat banyak fungsi skala, termasuk: skala (), skalaX(), skalaY(), skalaZ(), skala3d().

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

Dalam CSS3, skala bermaksud "zum" dan merupakan fungsi terbina dalam yang digunakan dalam atribut transformasi.

Terdapat banyak fungsi skala untuk atribut transformasi:

• skala()

• scaleX()

• scaleY()

• scaleZ()

• scale3d()

Apa yang berubah bukanlah lebar dan tinggi elemen, tetapi skala paksi X dan Y

skalaX(), skalaY()

Untuk elemen ini, >1 zum masuk, <1 zum keluar. Nilai lalai ialah 1; merasakan bahawa 100px telah menjadi 200px Tetapi sebenarnya, ia tidak. Apa yang berubah bukanlah lebar dan ketinggian elemen.

Sebenarnya, yang dia ubah bukanlah lebar dan tinggi elemen, tetapi skala paksi x dan y ↓

skala()

Ini adalah gabungan dua di atas, iaitu parameter pertama ialah x dan yang kedua ialah y

scale3d()

Parameter pertama ialah x dan Parameter kedua ialah y Parameter ketiga ialah z, iaitu gabungan scalex scaley scalez. Scalez, nilai ini pada asalnya 3D, jadi ia mungkin agak sukar untuk difahami Seperti gambar di atas, ia pada asalnya adalah gambar 2D Tidak kira bagaimana anda meregangkan paksi Znya, anda tidak akan melihatnya kesan . Premisnya ialah lukisan anda hanya boleh diregangkan jika ia adalah 3D, tetapi tidak boleh diregangkan jika ia adalah 2D. Jika ada rakan yang tidak tahu di mana paksi Z, sila klik di sini → rotateZ

Explore:

Pertama sekali, mari kita fikirkan soalan, Jika anda menggunakan putaran untuk berputar, paksi X dan Y akan berubah dengan putaran Jika anda menambah skalaX dan Y pada masa ini, adakah kesan skala semasa putaran? Mari kita perhatikan dahulu kesan pusingan dahulu dan kemudian berskala:

Setelah membaca gambar di atas, adakah anda fikir apabila berputar, akan ada The kesan skala berputar bersama-sama. tetapi! Jika anda menukar kedua-dua kedudukan, hasilnya akan berbeza sama sekali Skala pertama dan kemudian berputar

Bandingkan kedua-dua gambar, dan anda akan dapati itu. , Kesan gambar pertama memang diputarkan dengan kesan skala Mengapa ia berbeza apabila kedudukan diubah?

Sebenarnya, berputar dahulu dan kemudian berskala (mula-mula berputar, kemudian berskala) akan membawa kesan putaran, tetapi mula-mula berskala dan kemudian berputar (berskala pertama, kemudian berputar) tidak akan membawa kesan penskalaan dan kesan zum akan kekal di tempatnya dan akan berkuat kuasa apabila anda lalu. Lihat ilustrasi di bawah, nisbah zum akan kekal pada tempatnya, dan apabila melaluinya, nisbah akan dipulihkan.

(Mempelajari perkongsian video:

tutorial video css

, bahagian hadapan web

)

Atas ialah kandungan terperinci Apakah maksud skala css3?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!