الخاصية border-image-outset
< CSS
اذهب إلى التنقل
اذهب إلى البحث
الخاصية border-image-outset في CSS تُحدِّد كم ستمتد صورة الإطار بعد الحافة الخارجية للإطار.
بطاقة الخاصية
| القيمة الابتدائية | 0
|
|---|---|
| تُطبَّق على | جميع العناصر ما عدا عناصر الجدول الداخلية التي ضُبِطَت فيها الخاصية border-collapse إلى collapse.
|
| قابلة للوراثة | لا |
| قابلة للحركة | لا |
| القيمة المحسوبة | كما حُدِّدَت، لكن مع تحويل الأطوال النسبية إلى أطوال مطلقة. |
/* border-image-outset: all */
border-image-outset: 1.5;
/* border-image-outset: vertical horizontal */
border-image-outset: 1 1.2;
/* border-image-outset: top horizontal bottom */
border-image-outset: 30px 2 45px;
/* border-image-outset: top right bottom left */
border-image-outset: 7px 12px 14px 5px;
/* القيم العامة */
border-image-outset: inherit;
أمثلة
راجع صفحة الخاصية border-image.
دعم المتصفحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 15.0 | 15.0 | 11 | 15 | 6 |
البنية العامة
يمكن تحديد قيمة واحدة للخاصية border-image-outset أو قيمتين أو ثلاث قيم أو أربع قيم.
- عند تحديد قيمة واحدة، فستُطبّق على جميع أوجه الإطار.
- عند تحديد قيمتين، فأوّل قيمة ستُطبّق على الإطارين العلوي والسفلي، والقيمة الثانية على الإطارين الأيمن والأيسر.
- عند تحديد ثلاث قيم، فأوّل قيمة ستُطبّق على الإطار العلوي، والقيمة الثانية على الإطارين الأيمن والأيسر، والقيمة الثالثة على الإطار السفلي.
- عند تحديد أربع قيم، فستُطبّق القيم على الوجه العلوي ثم الأيمن ثم السفلي ثم الأيسر على التوالي وبالترتيب (أي أنَّ الدوران يبدأ من الوجه العلوي ثم يستمر وفق اتجاه عقارب الساعة).
<length>
تُحدِّد مقدار تجاوز صورة الإطار الحدود الخارجية للإطار. لا يُسمَح بالقيم السالبة.
<number>
تُحدِّد القيمة التي ستُضرَب بها قيمة الخاصية border-width لتحديد قيمة الخاصية border-image-outset. لا يُسمَح بالقيم السالبة.
البنية الرسمية
border-image-outset: [ <length> | <number> ]{1,4};
انظر أيضًا
- صفحة الخاصيات التي تضبطها الخاصية المختصرة
border-imageوهي:border-image-source، وborder-image-slice، وborder-image-width، وborder-image-repeat. - صفحة الخاصيات التي تضبطها الخاصية المختصرة
borderوهي:border-width، وborder-style، وborder-color.