CSS- Clip- Eigenschaft
Beispiel
Bild zuschneiden:
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Definition und Verwendung
Was passiert, wenn ein Bild größer ist als das enthaltende Element?
Mit der clip
Eigenschaft können Sie ein Rechteck angeben, um ein absolut positioniertes Element zu beschneiden. Das Rechteck wird als vier Koordinaten angegeben, alle von der linken oberen Ecke des auszuschneidenden Elements.
Hinweis: Die clip
Eigenschaft funktioniert nicht, wenn "overflow:visible".
Hinweis: Die clip
Eigenschaft ist veraltet und wird in Zukunft durch die Eigenschaft ersetzt.
clip-path
Standardwert: | Auto |
---|---|
Vererbt: | Nein |
Animierbar: | ja. Lesen Sie mehr über animierbare |
Ausführung: | CSS2 |
JavaScript-Syntax: | Objekt .style.clip="rect(0px,50px,50px,0px)" |
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die die Eigenschaft vollständig unterstützt.
Property | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
CSS-Syntax
clip: auto|shape|initial|inherit;
Eigenschaftswerte
Value | Description | Play it |
---|---|---|
auto | No clipping will be applied. This is default | |
shape | Clips an element. The only valid value is: rect (top, right, bottom, left) | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Verwandte Seiten
CSS-Tutorial: CSS-Positionierung
HTML-DOM-Referenz: Clip-Eigenschaft