Eigenschap clip
De eigenschap clip maakt het mogelijk een absoluut gepositioneerd element bij te snijden, waarbij alleen het opgegeven rechthoekige gebied zichtbaar blijft.
De waarde wordt opgegeven met behulp van de functie rect.
Syntaxis
selector {
clip: rect(boven, rechts, onder, links) | auto;
}
Voorbereiding van afbeeldingen
Stel we hebben een natuurafbeelding die we gaan bijsnijden:
<img src="image.jpg" width="500">
:
Voorbeeld
Laten we de afbeelding bijsnijden, zodat alleen het centrale deel zichtbaar blijft:
<div class="container">
<img class="image" src="image.jpg">
</div>
.container {
position: relative;
width: 400px;
height: 300px;
}
.image {
position: absolute;
clip: rect(50px, 350px, 250px, 50px);
width: 400px;
height: 300px;
}
:
