CSS/Eigenschaften/mask-clip

Die Eigenschaft mask-clip legt die Maskenfläche fest.

erlaubte Werte	no-clip: keine Maskenfläche geometry-box: margin-box: Box mitsamt durch margin festgelegten Außenabständen. Sind für eine Box keine Außenabstände definiert, so ist die Außenkante mit der Rahmenkante identisch. border-box: (Rahmenbox) Box, die content-box, einen möglichen Innenabstand und die durch border festgelegten Rahmen umfasst. Besitzt eine Box keinen Rahmen, so ist die Rahmenbox mit der Polsterungsbox identisch. padding-box: (Polsterungsbox) Bereich, der content-box und padding (Innenabstand) umfasst. Besitzt eine Seite keinen Innenabstand, so ist die Polsterungskante mit der Innenkante identisch. content-box: (Inhaltsbox) Bereich, der durch den Inhalt oder die Eigenschaften width und height festgelegt wurde. Siehe auch Box-Modell#Referenz-Box Vererbung steuernde Werte inherit, initial, unset und revert Defaultwert: border-box
anwendbar auf	alle Elemente (Unterschied Tag Element Attribut)
Browsersupport	Details: caniuse.com
Vererbung	nein
animierbar	nein

Beispiel

.masked {
  mask-image: url(./MDN.svg);
  mask-size: 100% 100%;
  mask-clip: border-box;
}

 

Beachten Sie: Für die mask-clip-Eigenschaft wird noch der vendor-prefix -webkit- benötigt.

Weblinks

• Spezifikation (W3C): mask-clip property
• MDN: mask-clip property

Siehe auch

• CSS/Tutorials/Masken und Beschneidungen/Masken
  • mask-clip