Właściwość transform
Właściwość transform ustawia transformacje
elementu, takie jak obrót,
skalowanie,
pochylenie,
przesunięcie
i inne. Odpowiednie transformacje zapisywane są
poprzez spację:
selektor {
transform: rotate(30deg) scale(3);
}
Przykład
W tym przykładzie blok jest obrócony o 30
stopni zgodnie z ruchem wskazówek zegara:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Przykład
W tym przykładzie oprócz obrotu dodano również pochylenie:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Przykład
W tym przykładzie oprócz obrotu i pochylenia dodano zmianę skali:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg) scale(2, 3);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
