clip प्रॉपर्टी
clip प्रॉपर्टी एक पूर्ण रूप से पोजीशन किए गए एलिमेंट को क्रॉप करने की अनुमति देती है, केवल निर्दिष्ट आयताकार क्षेत्र को दृश्यमान छोड़कर।
मान rect फ़ंक्शन का उपयोग करके निर्दिष्ट किया जाता है।
सिंटैक्स
सिलेक्टर {
clip: rect(ऊपर, दाएं, नीचे, बाएं) | auto;
}
इमेज तैयार करना
मान लीजिए कि हमारे पास प्रकृति की एक ऐसी इमेज है जिसे हम क्रॉप करेंगे:
<img src="image.jpg" width="500">
:
उदाहरण
आइए इमेज को क्रॉप करें, केवल केंद्रीय भाग को दृश्यमान छोड़कर:
<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;
}
:
