css outline width property

-

في هذه الخاصية يتم تحديد العرض ل الخاصية Outline لرسم خط حول محتويات elements border.

تمام خلونا نعمل مثال حتى نفهم الموضوع بشكل أفضل:

نبدأ بإنشاء ملف HTML باسم  Outline وبعدها نضيف الكود التالي: 

<!DOCTYPE html>
<html>
    <style>
        div{
            border: 1px solid black;
             outline-style: solid;
            outline-color: red;
            outline-width: thin;
        }
    </style>
<body>
   <div> outline تطبيق </div>            
</body>
</html>

شغل الصفحة ونشوف النتيجة (الصورة)
 
تمام طريقة الكتابة بتكون بالشكل: 
outline-width: value;
نتعرف على القيم التي يمكن تطبيقها في parameter الي تستخدم هنا :

القيمة
الوصف
fixed

قيمة ثابتة تكون ب px, em

مثال 

div { outline-width: 2px; }

thin

رسم خط بقيمة قد تكون 1 بكسل أو 2 بكسل حسب المتصفح

مثال 

div { outline-width: thin; }

medium

رسم خط بقيمة قد تكون 3 بكسل أو 4 بكسل حسب المتصفح

مثال 

div { outline-width: medium; }

thick

رسم خط بقيمة قد تكون 5 بكسل أو 6 بكسل حسب المتصفح

مثال 

div { outline-width: thick; }

outline-style
امثلة :
p { outline-width: thin; outline-style: solid; outline-color: black; }

div { outline-width: 3px; outline-style: dashed; outline-color: #FF0000; }