De eigenschap transform
De eigenschap transform bepaalt transformaties
van een element, zoals rotatie,
schaling,
scheefheid,
verplaatsing
en andere. De bijbehorende transformaties worden
gescheiden door spaties geschreven:
selector {
transform: rotate(30deg) scale(3);
}
Voorbeeld
In dit voorbeeld is het blok 30
graden met de klok mee gedraaid:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Voorbeeld
In dit voorbeeld is naast rotatie ook scheefheid toegevoegd:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Voorbeeld
In dit voorbeeld is naast rotatie en scheefheid ook eenschalingsverandering toegevoegd:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg) scale(2, 3);
border: 1px solid black;
width: 100px;
height: 50px;
}
: