Proprietatea transform
Proprietatea transform stabilește transformările
elementului, cum ar fi rotația,
scalarea,
înclinarea,
deplasarea
și altele. Transformările corespunzătoare sunt scrise
separate prin spațiu:
selector {
transform: rotate(30deg) scale(3);
}
Exemplu
În acest exemplu, blocul este rotit la 30
grade în sensul acelor de ceasornic:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Exemplu
În acest exemplu, pe lângă rotație, este adăugată și o înclinare:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Exemplu
În acest exemplu, pe lângă rotație și înclinare, este adăugată și o modificare a scării:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg) scale(2, 3);
border: 1px solid black;
width: 100px;
height: 50px;
}
: