CSS свойство offset-anchor

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

offset-anchor Атрибут specifies, что элемент фиксирован на offset-path пункты, определяемые атрибутом.

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

Пример

Фиксирует правый центр элемента <img> на определенном пути:

img {
  offset-path: path('M 50 80 C 150 -20 250 180 350 80');
  offset-anchor: right center;
}

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

Синтаксис CSS

offset-anchor: auto|value|initial|inherit;

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

Значение Описание
auto Значение по умолчанию. Пункт привязки расположен в центре элемента, что эквивалентно значению 50% 50%.
  • left top
  • left center
  • left bottom
  • right top
  • right center
  • right bottom
  • center top
  • center center
  • center bottom
 Если указан только один ключевое слово, другое значение будет "center".
xpos ypos

Первое значение - горизонтальное положение, второе значение - вертикальное положение.

Upper left is 0 0.

Единицы могут быть пикселями (0px 0px) или любыми другими единицами CSS.

Если указан только один значений, другое значение будет 50%.

Можно комбинировать % и положение.
x% y%

Первое значение - горизонтальное положение, второе значение - вертикальное положение.

Upper left is 0% 0%. Lower right is 100% 100%.

Если указан только один значений, другое значение будет 50%.

Значение по умолчанию: 50% 50%.
initial Этот атрибут устанавливается в значение по умолчанию. См. также initial.
inherit Этот атрибут наследуется от родительского элемента. См. также inherit.

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

Значение по умолчанию: auto
Ингеритируемость: Нет
Создание анимации: Поддерживается. См. также:Атрибуты, связанные с анимацией.
Версия: CSS3
Синтаксис JavaScript: object.style.offsetAnchor="bottom right"

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

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

Хром Эдж Фаерфокс Сафари Опера
116 116 72 16 102

Соответствующие страницы

Урок:Пути SVG

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

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

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

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

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

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