الخاصية outline-offset

من موسوعة حسوب
< CSS
مراجعة 07:40، 30 أكتوبر 2017 بواسطة عبد اللطيف ايمش (نقاش | مساهمات)
(فرق) → مراجعة أقدم | المراجعة الحالية (فرق) | مراجعة أحدث ← (فرق)
اذهب إلى التنقل اذهب إلى البحث

الخاصية outline-offset في CSS تضبط المسافة التي تبعد فيها حدود outline العنصر عن حافته أو إطاره border، والحدود هي الخطوط التي تُرسَم خارج إطار العنصر border. المسافة التي ستوضع بين إطار العنصر وحدوده هي مسافة ذات خلفية شفافة، أي ستُعرَض خلفية العنصر الأب فيها.

/* <length> القيم الطولية */
outline-offset: 3px;
outline-offset: 0.2em;

/* القيم العامة */
outline-offset: inherit;
outline-offset: initial;
outline-offset: unset;
القيمة الابتدائية 0
تُطبَّق على جميع العناصر.
قابلة للوراثة لا
قابلة للحركة نعم
القيمة المحسوبة كما حُدِّدَت، لكن مع تحويل الأطوال النسبية إلى مطلقة.

أمثلة

سنترك -في المثال الآتي- مسافة وقدرها 10px بين العنصر وحدوده، باستخدام الخاصية outline-offset:

<p>حدود هذا العنصر ستبعد عنه مسافة 10 بكسل.</p>

وضعنا خلفيةً وإطارًا للعنصر لكي نعرف أين ينتهي صندوق العنصر:

p {
  outline: 1px dashed salmon;
  outline-offset: 10px;
  background-color: lightgray;
  border: 1px solid #069;
  margin: 15px;
}

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

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي 1.0 1.5 غير مدعومة 9.5 1.2

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

الخاصية outline-offset تقبل قيمةً طوليةً واحدةً.

القيمة <length>

المسافة التي تفصل بين العنصر وبين حدوده، وإذا كانت هذه القيمة سالبةً فستُرسَم الحدود داخل العنصر، أما القيمة 0 فلن تؤدي إلى إضافة أيّة مسافات بين العنصر وحدوده.

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

outline-offset: <length>;

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