أكثر "Try it Yourself" الأمثلة أدناه.
تعريف واستخدام
مخطط هو خط التي يتم رسمها حول العناصر (outside the borders) لجعل عنصر "stand out" .
تحدد الخاصية على غرار مخطط نمط مخطط تفصيلي.
القيمة الافتراضية: | none |
---|---|
وارث: | no |
Animatable: | no. Read about animatable |
الإصدار: | CSS2 |
جافا سكريبت بناء الجملة: | object .style.outlineStyle="dashed" Try it |
نصائح وملاحظات
مخطط هو خط حول عنصر. يتم عرضه في جميع أنحاء هامش العنصر. ومع ذلك، فإنه يختلف عن الممتلكات الحدود.
الخطوط العريضة ليست جزءا من أبعاد العنصر، وبالتالي العرض والارتفاع خواص العنصر لا تحتوي على عرض المخطط التفصيلي.
دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
خاصية | |||||
---|---|---|---|---|---|
outline-style | 1.0 | ثمانية | 1.5 | 1.2 | 7.0 |
Note: IE8 يدعم خاصية على غرار الخطوط العريضة فقط إذا تم تحديد DOCTYPE!.
CSS بناء الجملة
outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
قيم الملكية
القيمة | وصف | العبها |
---|---|---|
none | تحدد أية المخطط. هذا هو الافتراضي | العبها " |
hidden | يحدد الخطوط العريضة مخفي | العبها " |
dotted | يحدد الخطوط العريضة منقط | العبها " |
dashed | يحدد الخطوط العريضة متقطع | العبها " |
solid | يحدد الخطوط العريضة الصلبة | العبها " |
double | يحدد تلينر مزدوج | العبها " |
groove | يحدد الخطوط العريضة مخدد 3D. تأثير يعتمد على قيمة مخطط لون | العبها " |
ridge | يحدد الخطوط العريضة مخدد 3D. تأثير يعتمد على قيمة مخطط لون | العبها " |
inset | يحدد الخطوط العريضة 3D أقحم. تأثير يعتمد على قيمة مخطط لون | العبها " |
outset | يحدد الخطوط العريضة البداية 3D. تأثير يعتمد على قيمة مخطط لون | العبها " |
initial | تحدد هذه الخاصية إلى قيمته الافتراضية. قرأت عن الأولي | العبها " |
inherit | يرث هذه الخاصية من عنصر الأم. قراءة حول وراثة |
مزيد من الأمثلة
مثال
تعيين نمط مخطط باستخدام قيم مختلفة:
p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;}
انها محاولة لنفسك » صفحات ذات صلة
درس CSS: CSS المخطط
CSS المرجع outline property
HTML DOM المرجع outlineStyle property