CSS Transform generator til dovne mennesker.
Indstil skalaen, drej, oversæt og skæv, og se live forhåndsvisningen for at få den ønskede visning.
Undgå at angive ekstreme værdier for skævhedsegenskaben, da forhåndsvisningen kan dække indstillingspanelet. I denne situation bliver du nødt til at opdatere siden.
Skaler, roter, oversæt og skæv
Skalering fungerer, som du ville zoome ind og ud på det målrettede element. Standardskalaværdien er 1, hvilket fungerer som en multiplikator af den originale størrelse. Det betyder, at 0,5 halverer, mens 2 fordobler sektionen.
Drej elementet med uret med den anden egenskab, der er indstillet i grader. Drejning med 180° sætter objektet på hovedet, mens 360° tager er tilbage til sin oprindelige oprejste position. Indstil enhver positiv eller negativ værdi eller endda decimaler.
Oversæt flytter elementet med pixels relateret til dets oprindelige position. X-værdien vandret, mens Y lodret, når der er rotationsattribut, er nul.
Skæv genstandene på deres vandrette (X) eller lodrette (Y) aksel.
CSS-transformation forklaret
Transform CSS-egenskaben lader dig rotere, skalere, skæve og oversætte et element. Det ændrer koordinatrummet for den visuelle CSS-formateringsmodel.
Definition og brug
Transformationsegenskaben anvender en 2D- eller 3D-transformation til et element. Denne egenskab giver dig mulighed for at rotere, skalere, flytte, skæve osv. elementer.
Browser support
Tallene i tabellen angiver den første browserversion, der fuldt ud understøtter egenskaben.
Tal efterfulgt af -webkit-, -moz- eller -o- angiver den første version, der fungerede med et præfiks.
Syntaks
transform: none|transform-functions|initial|inherit;
