الخاصية border-image-source

من موسوعة حسوب
< CSS
اذهب إلى: تصفح، ابحث

الخاصية border-image-source في CSS تُعرِّف صورةً <image> لتُستخدَم بدلًا من الإطار، وإذا ضُبِطَت هذه الخاصية إلى none، فسيُستخدَم الشكل المُعرَّف في الخاصية border-style.

بطاقة الخاصية

القيمة الابتدائية none
تُطبَّق على جميع العناصر.
قابلة للوراثة لا
قابلة للتحريك لا
القيمة المحسوبة none، أو سيُحوَّل رابط URI للصورة إلى رابط مطلق.
/* لا توجد صورة للإطار */
border-image-source: none;

/* تحديد مسار الصورة التي ستُعرَض في الإطار */
border-image-source: url(image.jpg);

/* استخدام تدرج لوني */
border-image-source: linear-gradient(to top, red, yellow);

/* القيم العامة */
border-image-source: inherit;
border-image-source: initial;
border-image-source: unset;
ملاحظة: صحيحٌ أنَّ أي نوع من أنواع القيمة <image> يمكن أن يُستعمَل مع هذه الخاصية، لكن دعم المتصفحات ما يزال محدودًا، وبعض المتصفحات لا تدعم إلا الصور المُعرّفة عبر الدالة url()‎.

أمثلة

راجع صفحة border-image لأمثلة عن سلوك مختلف القيم.

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي 15.0 15.0 11 15 6

البنية العامة

تقبل الخاصية border-image-source إحدى القيمتين الآتيتين:

none

تُحدِّد أنَّه لا يجب استخدام صورة مع الإطار، وإنما يجب استخدام الشكل المُعرّف في الخاصية border-style.

<image>

مرجع إلى صورة لتستخدم في الإطار.

البنية الرسمية

border-image-source: none | <image>;

انظر أيضًا

مصادر ومواصفات