CSS clip egenskab

Definisjon og bruk

clip-egenskapen klipper absolute plasseringselementer.

Hva skjer når et bilde er større enn det inneholdende elementet? "clip"-egenskapen lar deg spesifisere en synlig størrelse for et element, slik at dette elementet blir klippet og vist som denne formen.

forklaring

Denne egenskapen brukes til å definere en klipp-rectangel. For et absolutt definert element er innholdet inne i denne klipp-området synlig. Innhold utenfor klipp-området håndteres basert på verdien av overflow. Klipp-området kan være større eller mindre enn innholdets område.

Vennligst se også:

CSS lærebok:CSS posisjonering

HTML DOM referansehåndboken:clip-egenskapen

eksempel

Klipp bildet:

img
  {
  position:absolute;
  clip:rect(0px,60px,200px,0px);
  }

Prøv selv

CSS syntaks

clip: auto|form|initial|inherit;

egenskapsverdi

verdi beskrivelse
form Sette elementets form. Den eneste gyldige formverdien er: rect (topp, høyre, bunn, venstre)
auto Standardverdi. Ingen klipping skal brukes.
inherit Det skal spesifiseres at clip-egenskapen skal arves fra foreldreelementet.

Tekniske detaljer

Standardverdi: auto
Arvbarhet: nei
Versjon: CSS2
JavaScript syntaks: object.style.clip="rect(0px,50px,50px,0px)"

Flere eksempler

Sette elementets form
Dette eksempelet viser hvordan du setter elementets form. Dette elementet blir klippet til formen og vises deretter.

Nettleserstøtte

Tallene i tabellen angiver den første nettleserversjonen som fullt ut støtter egenskapen.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.0 1.0 7.0