Свойство transform
задает трансформации
элемента, такие как вращение,
масштабирование,
скос,
сдвиг
и другие. Соответствующие трансформации записываются
через пробел:
селектор {
transform: rotate(30deg) scale(3);
}
Пример
В данном примере блок повернут на 30
градусов по часовой стрелке:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
В данном примере кроме поворота добавлен еще и скос:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg);
border: 1px solid black;
width: 100px;
height: 50px;
}
:
Пример
В данном примере кроме поворота и скоса добавлено изменение масштаба:
<div id="elem">lorem ipsum</div>
#elem {
transform: rotate(30deg) skew(20deg) scale(2, 3);
border: 1px solid black;
width: 100px;
height: 50px;
}
: