Функция rotate3d

Функция rotate3d элементни берылган бурчакка уч ўлчовли фазода X, Y, Z ўқларига нисбатан биргаликда айлантиради. Ушбу функция transform хусусияти билан бирга ишлатилади. Хусусиятнинг қиймати сифатида <angle> бирликларида ифодаланган бурчак қиймати кўлланилади.

Функция қиймат сифатида вергул билан ажратилган 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);
}

Результат:

Шунингдек қаранг

  • rotate функцияси,
    X ва Y ўқлари атрофида айланишни белгилайди
  • rotateX функцияси,
    X ўқи атрофида айланишни белгилайди
  • rotateY функцияси,
    Y ўқи атрофида айланишни белгилайди
  • rotateZ функцияси,
    Z ўқи атрофида айланишни белгилайди