Mafuta wa Style transform

Mifano na matumizi

transform Mafuta wa transform inayotumia 2D au 3D kwa kina. Mafuta huu inaruhusi kufanya mifano ya kina kama uharibifu, uharifu, uharibifu, kushambulia na kama kina

Tazama pia:

Kitabu cha CSS:Jaribu mafanikio ya transform

Mfano

Mfupisha div yaani:

document.getElementById("myDIV").style.transform = "rotate(7deg)";

Jifunze tena

Inayotumiwa kwa:

Kurejesha tabia ya transform:

object.style.transform

Kumaliza tabia ya transform:

object.style.transform = "none|transform-functions|initial|inherit"

Thamani ya tabia

Thamani Kuelewa
none Kumaliza na haukufikia mawasiliano.
matrix(n, n, n, n, n, n) Kumaliza mawasiliano ya 2D na kutumia matokeo ya sita kwenye ukinga.
matrix3d(n, n, n, n, etc....) Kumaliza mawasiliano ya 3D na kutumia matokeo ya 16 kwenye ukinga wa 4x4.
translate(x, y) Kumaliza mawasiliano ya 2D.
translate3d(x, y, z) Kumaliza mawasiliano ya 3D.
translateX(x) Kumaliza mawasiliano na kutumia thamani ya X pekee.
translateY(y) Kumaliza mawasiliano na kutumia thamani ya Y pekee.
translateZ(z) Kumaliza mawasiliano ya 3D na kutumia thamani ya Z pekee.
scale(x, y) Kumaliza mawasiliano ya 2D.
scale3d(x, y, z) Kumaliza mawasiliano ya 3D.
scaleX(x) Kumaliza mawasiliano ya kinalesha kwenye thamani ya X.
scaleY(y) Kumaliza mawasiliano ya kinalesha kwenye thamani ya Y.
scaleZ(z) Kumaliza mawasiliano ya 3D na kumaliza kinalesha kwenye thamani ya Z.
rotate(angle) Kumaliza mawasiliano ya 2D na kumaliza anga kwenye thamani.
mawasiliano ya 3D(x, y, z, angle) Kumaliza mawasiliano ya 3D.
mawasiliano ya X(angle) Kumaliza mawasiliano ya 3D kutumia X.
mawasiliano ya Y(angle) Kumaliza mawasiliano ya 3D kutumia Y.
mawasiliano ya Z(angle) Kumaliza mawasiliano ya 3D kutumia Z.
kusikia(x-angle, y-angle) Kumaliza kusikia 2D kutumia X na Y.
kusikia ya X(angle) Kumaliza kusikia 2D kutumia X.
kusikia ya Y(angle) Kumaliza kusikia 2D kutumia Y.
pana ya perspective(n) Kumaliza pana ya kinalesha ya 3D ya kutumia elementi.
initial Kumaliza tabia hii kwa chaguo cha kuzingatia. Tazama: initial.
inherit Kumaliza tabia hii kwa chaguo cha kuzingatia kutoka kwa kinalesha kinaofikia. Tazama: inherit.

Mafanikio ya teknolojia

Chaguo cha kuzingatia: Hakuna
Matokeo ya kurejesha: Inasema kiwango cha elementi Jaribu mafanikio ya transform.
Tokea kwa CSS: CSS3

Kinalesha husaidia

Mafanikio ya namba kwenye tabia inaonyesha toka kwa kinalesha ambao kinaukubalia kufanya hii katika sababu ya kinalesha.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0 10.0 16.0 9.0 23.0