الخاصية outline-width
< CSS
الخاصية outline-width
في CSS تضبط عرض (أو ثخن) حدود outline
العنصر، التي هي الخطوط التي تُرسَم خارج إطار العنصر border
. من المستحسن استخدام الخاصية المختصرة outline
عند ضبط مظهر حدود العنصر، لأنها تضبط عدِّة خاصيات في آنٍ واحد.
/* الكلمات المحجوزة */
outline-width: thin;
outline-width: medium;
outline-width: thick;
/* <length> القيم الطولية */
outline-width: 1px;
outline-width: 0.1em;
/* القيم العامة */
outline-width: inherit;
القيمة الابتدائية | medium
|
---|---|
تُطبَّق على | جميع العناصر. |
قابلة للوراثة | لا |
قابلة للحركة | نعم |
القيمة المحسوبة | طول مطلق، إلا إذا حُدِّدَت الكلمة المحجوزة none فستكون القيمة المحسوبة 0.
|
أمثلة
سنستعرض في المثال الآتي جميع القيم التي تقبلها الخاصية outline-width
:
<span id="thin">thin</span>
<span id="medium">medium</span>
<span id="thick">thick</span>
<span id="twopixels">2px</span>
<span id="oneex">1ex</span>
<span id="em">1.2em</span>
شيفرة CSS:
span {
outline-style: solid;
display: inline-block;
margin: 20px;
}
#thin { outline-width: thin; }
#medium { outline-width: medium; }
#thick { outline-width: thick; }
#twopixels { outline-width: 2px; }
#oneex { outline-width: 1ex; }
#em { outline-width: 1.2em; }
دعم المتصفحات
الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
الدعم الأساسي | 1.0 | 1.5 | 8.0 | 7.0 | 1.2 |
البنية العامة
الخاصية outline-width
تقبل قيمةً واحدةً من القيم التالية.
القيمة thin
سيكون عرض الحدود رفيعًا، وتختلف هذه القيمة بين المتصفحات لكنها تساوي عادةً 1px
.
القيمة medium
سيكون عرض الحدود متوسطًا، وتختلف هذه القيمة بين المتصفحات لكنها تساوي عادةً 3px
.
القيمة thick
سيكون عرض الحدود ثخينًا، وتختلف هذه القيمة بين المتصفحات لكنها تساوي عادةً 5px
.
القيمة <length>
سيكون عرض الحدود مُحدَّدًا عبر قيمةٍ طولية <length>
.
البنية الرسمية
outline-width: <br-width>;
حيث:
<br-width> = <length> | thin | medium | thick
مصادر ومواصفات
- مواصفة CSS Basic User Interface Module Level 3.
- مسودة CSS Transitions.
- مواصفة CSS Level 2 (Revision 1).