دليل مرجعي لـ CSS

قواعد CSS (RULES)

دليل الخصائص الكاملة لـ CSS

خصائص لون رسم الهيكل CSS خصائص الترتيب CSS3

طريقة استخدام خاصية الخطوط النحوية لـ CSS ومثال

يضبط عرض الحواف الأربعة للشكل من خلال خاصية الخطوط النحوية، ويحدد النمط والألوان. إنه يُستخدم لضبط خصائص الخطوط النحوية المختلفة في بيانة واحدة (بمعنىoutline-width،outline-styleوoutline-colorمصطلح بديل مختصر.

جدول أدناه يوضح استخدام هذه الخاصية وتاريخ إصداراتها، بالإضافة إلى استخدام الخاصية في لغة الجافا سكربت.

القيمة الافتراضية:	عرض جميع الخصائص
يطبق على:	جميع العناصر
التوريث:	لا يوجد
يمكن أن يتم تصنيعها كرسوم متحركة:	نعم، لأن بعض خصائص السكرابت يمكن تعيينها كرسوم متحركة.يرجى الرجوع إلى خصائص الرسوم المتحركة。
الإصدار:	CSS 2、3
JavaScript Syntax:	object.style.outline="#cc0000 dotted thin"

نموذج استخدام outline

نموذج هذه الخاصية كالتالي:

outline:　[　outline-width　outline-style　outline-color　]　|　initial　|　inherit

ملاحظة:إذا كانت أي من الخاصيات المذكورة أعلاه مفقودة أو مكتوبة بشكل مختصر، فإنها ستقوم بإدراج قيمة افتراضية لهذه الخاصية (إذا كانت موجودة). للحصول على مزيد من التفاصيل، يرجى الرجوع إلى كل خاصية.

النموذج التالي يوضح كيفية استخدام الخاصية outline.

مثال

　　p.one　{
　　　outline:　2px　solid　#ff0000;
　　}
　　p.two　{
　　　color:　#00ff00;
　　　outline-top:　5px　solid;
　　}

اختبار ل‹/›

ملاحظة:إذاoutline-colorإذا كانت مفقودة أو غير محددة (مثل outline: 5px solid;)، فإنها ستستخدمcolorقيمة الخاصية العنصر. ولكن، في بعض الحالات الخاصة، يمكنoutline-styleلن يتم عرض أي هيكل لأن قيمة الخاصية outline-style هي none بشكل افتراضي.

قيمة الخاصية

جدول التالي يصف القيم لهذه الخاصية.

القيمة	الوصف
outline-width	إعداد عرض الهيكل العنصر.
outline-style	إعداد نمط الخطوط للهيكل العنصر.
outline-color	إعداد لون الهيكل العنصر.
initial	إعداد هذه الخاصية إلى قيمتها الافتراضية.
inherit	إذا تم تحديد هذه الخاصية، فإن العنصر المرتبط يستخدم نفس الخاصية outline للعنصر الأب.

توافق المتصفح

توافق متصفحات outline الخاصية، الأرقام في الجدول التالي تمثل أحدث إصدار من المتصفح الذي يدعم هذه الخاصية؛ جميع المتصفحات الشائعة يدعمون هذه الخاصية.

	Firefox 1.5 وأعلى Google Chrome1+ Internet Explorer 8+ Apple Safari 1.2+ Opera 7+

تحذير: Internet Explorer 7 وأحدث إصداراته لا يدعم الخاصية outline. يدعم IE8 هذه الخاصية، لكنها تحتاج إلى<!DOCTYPE>。

للقراءة المزيد

يرجى الرجوع إلى الدروس التالية:CSS العناوين،CSS الحدود。

الخصائص ذات الصلة:outline-width،outline-style،outline-color

خصائص لون رسم الهيكل CSS خصائص الترتيب CSS3