CSS offset-distance Eigenschaft

Definition und Verwendung

offset-distance Diese Eigenschaft wird verwendet, um den Abstand zwischen dem Element und dem von offset-path Der Abstand zwischen den Startpunkten der durch die Eigenschaft definierten Pfade.

Beispiel

Das <img>-Element wird auf dem definierten Pfad positioniert und befindet sich 33% vom Anfang des Pfades entfernt.

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

Probieren Sie es selbst aus

CSS-Syntax

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

Eigenschaftswert

Wert Beschreibung
0 Das Element wird am Anfang des Pfades positioniert. Standardwert.
length

Verwenden Sie feste Einheiten (wie px, pt, cm usw.), um den Abstand zwischen dem Element und dem Anfang des Pfades zu spezifizieren.

Negative Werte sind nicht erlaubt. Bitte参阅：CSS-Einheiten.
% Spezifizieren Sie den prozentualen Abstand relativ zur Länge des Pfades.
initial Diese Eigenschaft auf ihren Standardwert setzen. Bitte参阅： initial.
inherit Diese Eigenschaft wird von ihrem Elternelement geerbt. Bitte参阅： inherit.

Technische Details

Standardwert: 0
Vererbbarkeit: Nein
Animationserstellung: Unterstützt. Bitte参阅：Eigenschaften, die mit Animationen zusammenhängen.
Version: CSS3
JavaScript-Syntax: object.style.offsetDistance="200px"

Browser-Unterstützung

Die Zahlen in der Tabelle stellen die Versionsnummer der ersten Browser dar, die diese Eigenschaft vollständig unterstützen.

Chrome Edge Firefox Safari Oper
55 79 72 16 42

Verwandte Seiten

Tutorial:SVG-Pfad

Tutorial:CSS-Animation

Referenz:CSS offset Eigenschaft

Referenz:CSS offset-anchor Eigenschaft

Referenz:CSS offset-path Eigenschaft

Referenz:CSS offset-position Eigenschaft

Referenz:CSS offset-rotate Eigenschaft