from

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das from-Attribut gibt den Anfangswert des Attributs an, das während der Animation modifiziert wird.

Wenn es mit dem to-Attribut verwendet wird, ändert die Animation das modifizierte Attribut vom from-Wert zum to-Wert. Wenn es mit dem by-Attribut verwendet wird, ändert die Animation das Attribut relativ vom from-Wert um den im by-Wert angegebenen Wert.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <rect x="10" y="10" height="100">
    <animate attributeName="width" fill="freeze" from="100" to="150" dur="3s" />
  </rect>
</svg>

Verwendungshinweise

Wert	Siehe unten
Standardwert	Keiner
Animierbar	Nein

Der genaue Werttyp für dieses Attribut hängt vom Wert des Attributs ab, das animiert wird.

Wenn eine Liste von Werten über das values-Attribut definiert wird, wird das from-Attribut ignoriert.

Spezifikationen

Specification
SVG Animations Level 2 # FromAttribute

Browser-Kompatibilität

BCD tables only load in the browser