Функцыя rotate3d

Функцыя rotate3d задае паварот элемента на зададзены кут адначасова адносна восі X, Y, Z у трохмернай прасторы. Выкарыстоўваецца сумесна з уласцівасцю transform. Значэннем уласцівасці служыць кут у любых адзінках вымярэння для вуглоў.

У якасці значэнняў функцыя прымае 4 параметры, запісаныя праз коску. Першыя тры параметры вызначаюць вектор восі ў трохмернай прасторы, адносна якой будзе ажыццяўляцца паварот. Чацвёрты параметр задае кут павароту.

Сінтаксіс

cssселектар {
  transform: rotate3d(X, Y, Z, кут);
}

Прыклад

У гэтым прыкладзе вектор восі будзе накіраваны ў правы верхні кут экрана:

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

css#elem {
  border: 3px solid black;
  width: 100px;
  height: 50px;
  transition: transform 3s linear;
}
#elem:hover {
  transform: rotate3d(1, 1, 0, 180deg);
}

Результат:

Глядзіце таксама