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

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

offset-distance Свойство используется для установки расстояния от элемента до пути, определяемого offset-path Расстояние между точками начала пути, определяемыми свойством.

Пример

Элемент <img> размещается на определенном пути, на расстоянии 33% от начала пути.

img {
  offset-path: path('M 50 80 C 150 -20 250 180 350 80');
  offset-distance: 33%;
}

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

Синтаксис CSS

offset-distance: auto|length|initial|inherit;

Значение свойства

Значение Описание
0 Элемент находится на начальной точке пути. Значение по умолчанию.
length

Использовать фиксированные единицы измерения (например, px, pt, cm и т.д.) для указания расстояния от элемента до точки начала пути.

Отрицательные значения не допускаются. См. также:Единицы CSS.
% Указать процентное расстояние от начала пути.
initial Установить это свойство в его значение по умолчанию. См. также initial.
inherit Эта свойство наследуется от родительского элемента. См. также inherit.

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

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

Поддержка браузеров

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

Кром Эдж Фаерфокс Сафари Опера
55 79 72 16 42

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

Урок:SVG-путь

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

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

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

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

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

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