Свойство offset-rotate CSS

Определение и использование

offset-rotate Этот атрибут используется для установки угла вращения анимационных элементов, движущихся по пути.

Пример

Пример 1

Установить угол вращения для трех элементов <img>, движущихся по пути:

#fish1 {
  offset-rotate: auto;
}
#fish2 {
  offset-rotate: auto 90deg;
}
#fish3 {
  offset-rotate: 90deg;
}

Попробуйте сами

Пример 2

Используйте единицы turn вместо deg для указания угла вращения элемента:

div {
  offset-rotate: 0.25turn;
}

Попробуйте сами

CSS синтаксис

offset-rotate: auto|angle|initial|inherit;

Значение атрибута

Значение Описание
auto Элемент направлен в сторону движения по пути. Значение по умолчанию.
angle Определить угол вращения элемента с постоянным углом.
auto angle Одновременно определить auto и angleУгол добавляется к умолчанию вращения, по часовой стрелке.
reverse Элемент вращается в направлении, противоположном умолчанию.
initial Установить этот атрибут в его значение по умолчанию. См. также initial.
inherit Этот атрибут наследуется от родительского элемента. См. также inherit.

Технические детали

Значение по умолчанию: auto
Ингерит: Нет
Создание анимации: Поддерживается. См. также:Свойства анимации.
Версия: CSS3
JavaScript синтаксис: object.style.offsetRotate="45deg"

Поддержка браузерами

Числа в таблице показывают версию первого браузера, который полностью поддерживает этот атрибут.

Кروм Эдж Фаерфокс Сафари Опера
56 79 72 16 43

Связанные страницы

Урок:SVG путь

Урок:Анимация CSS

См. также:Свойство offset CSS

См. также:Свойство offset-anchor CSS

См. также:Свойство offset-distance CSS

См. также:Свойство offset-path CSS

См. также:Свойство offset-position CSS