A clip tulajdonság
A clip tulajdonság lehetővé teszi egy abszolút pozicionált elem vágását, csak a megadott téglalap alakú területet hagyva láthatóban.
Az érték a rect függvény segítségével adható meg.
Szintaxis
selector {
clip: rect(top, right, bottom, left) | auto;
}
Képek előkészítése
Tegyük fel, hogy van egy természetről szóló képe, amelyet levágunk:
<img src="image.jpg" width="500">
:
Példa
Vágjuk körbe a képet, csak a középső részt hagyva láthatóban:
<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;
}
:
