خاصية مقطع CSS
مثال
قص صورة:
img {
position: absolute;
clip: rect(0px,60px,200px,0px);
}
التعريف والاستخدام
ماذا يحدث إذا كانت الصورة أكبر من العنصر الذي يحتويها؟
تتيح لك الخاصية تحديد clip
مستطيل لقص عنصر تم تحديد موضعه بشكل مطلق. تم تحديد المستطيل بأربعة إحداثيات ، كل ذلك من الزاوية العلوية اليسرى للعنصر المراد قصه.
ملاحظة: الخاصية لا clip
تعمل إذا كان "overflow: مرئي".
ملاحظة: تم clip
إيقاف العمل بالملكية وسيتم استبداله بالموقع في المستقبل.
clip-path
القيمة الافتراضية: | تلقاءي |
---|---|
وارث: | رقم |
متحرك: | نعم. اقرأ عن animatable |
الإصدار: | CSS2 |
بناء جملة JavaScript: | الكائن .style.clip = "rect (0px، 50px، 50px، 0px)" |
دعم المتصفح
تحدد الأرقام الواردة في الجدول إصدار المتصفح الأول الذي يدعم الخاصية بالكامل.
Property | |||||
---|---|---|---|---|---|
clip | 1.0 | 8.0 | 1.0 | 1.0 | 7.0 |
بنية CSS
clip: auto|shape|initial|inherit;
قيم الملكية
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 |
الصفحات ذات الصلة
برنامج CSS التعليمي: CSS Positioning
مرجع DOM HTML: خاصية القصاصة