clip

Veraltet: Diese Funktion wird nicht mehr empfohlen. Obwohl einige Browser sie möglicherweise noch unterstützen, kann sie bereits aus den relevanten Webstandards entfernt worden sein, befindet sich im Prozess der Entfernung oder wird nur aus Kompatibilitätsgründen beibehalten. Vermeiden Sie die Verwendung und aktualisieren Sie gegebenenfalls bestehenden Code; siehe die Kompatibilitätstabelle am Ende dieser Seite, um Ihre Entscheidung zu treffen. Beachten Sie, dass diese Funktion jederzeit nicht mehr funktionieren kann.

Das clip Attribut ist ein Präsentationsattribut, das den sichtbaren Bereich eines Elements definiert.

Dieses Attribut hat die gleichen Parameterwerte wie für die CSS-Eigenschaft clip definiert. Einheitslose Werte, die aktuelle Benutzerkoordinaten anzeigen, sind für die Koordinatenwerte im rect() erlaubt. Der Wert auto definiert einen Clip-Pfad entlang der Grenzen des vom angegebenen Element erstellten Ansichtsfensters.

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

Beispiel

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

html

<svg viewBox="0 0 20 10" xmlns="http://www.w3.org/2000/svg">
  <!-- Auto clipping -->
  <svg x="0" width="10" height="10" clip="auto">
    <circle cx="5" cy="5" r="4" stroke="green" />
  </svg>

  <!-- Rect(top, right, bottom, left) clipping -->
  <svg x="10" width="10" height="10" clip="rect(1, 9, 8, 2)">
    <circle cx="5" cy="5" r="4" stroke="green" />
  </svg>
</svg>

Verwendungshinweise

Warnung: Diese Eigenschaft ist veraltet. Verwenden Sie stattdessen clip-path.

Wert	`auto` \| `rect()`
Standardwert	`auto`
Animierbar	Ja

Der Wert auto definiert einen Clip-Pfad entlang der Grenzen des vom angegebenen Element erstellten Ansichtsfensters. Der Wert rect() definiert ein Clip-Rechteck nach folgender Syntax: rect(<oben>, <rechts>, <unten>, <links>). Die Werte <oben> und <unten> geben die Abstände von der oberen Randkante des Elementansichtsfensters an, während <rechts> und <links> die Abstände von der linken Randkante des Elementansichtsfensters angeben.

Spezifikationen

Specification
CSS Masking Module Level 1 # clip-property

Browser-Kompatibilität

BCD tables only load in the browser