Proprietà clip CSS
Esempio
Ritaglia un'immagine:
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
Definizione e utilizzo
Cosa succede se un'immagine è più grande del suo elemento che la contiene?
La clip
proprietà consente di specificare un rettangolo per ritagliare un elemento posizionato in modo assoluto. Il rettangolo è specificato come quattro coordinate, tutte dall'angolo superiore sinistro dell'elemento da ritagliare.
Nota: la clip
proprietà non funziona se "overflow:visibile".
Nota: la clip
proprietà è deprecata e sarà sostituita dalla proprietà in futuro.
clip-path
Valore di default: | auto |
---|---|
Ereditato: | no |
Animabile: | sì. Leggi su animabile |
Versione: | CSS2 |
sintassi JavaScript: | oggetto .style.clip="rect(0px,50px,50px,0px)" |
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la proprietà.
Property | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
Sintassi CSS
clip: auto|shape|initial|inherit;
Valori di proprietà
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 |
Pagine correlate
Tutorial CSS: Posizionamento CSS
Riferimento HTML DOM: proprietà clip