Lastnost transform

Lastnost transform določa transformacije elementa, kot so vrtenje, povečava, nagnjenje, premik in druge. Ustrezne transformacije se zapišejo presledkovno ločene:

cssselektor {
  transform: rotate(30deg) scale(3);
}

Primer

V tem primeru je blok zasukan za 30 stopinj v smeri urinega kazalca:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: rotate(30deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Primer

V tem primeru je poleg vrtenja dodano še nagnjenje:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: rotate(30deg) skew(20deg);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат:

Primer

V tem primeru je poleg vrtenja in nagnjenja dodano še spreminjanje merila:

html<div id="elem">lorem ipsum</div>

css#elem {
  transform: rotate(30deg) skew(20deg) scale(2, 3);
  border: 1px solid black;
  width: 100px;
  height: 50px;
}

Результат: