CSS

CSS Outline
الإطارات الخارجية في لغة CSS

سوف تتعلم في هذا الدرس عمل Outline إطارات خارجية تكون خارج حدود العناصر بعد أو أعلي border في لغة CSS.

التاريخ

09 نوفمبر 2020

الدروس

137

المستوى

مبتدئ

اللغة

انجليزي

المشاهدات

1846

المواضيع

24
الشروحات chevron_left CSS Outline chevron_left CSS
CSS Flex Box keyboard_arrow_down

CSS Outline
الإطارات الخارجية في لغة CSS

</> CSS Outline
الإطارات الخارجية في لغة CSS

خاصية outline تُستخدم في اضافة إطار خارجي لجميع عناصر HTML ويمكنك التحكم في سُمك (حجم) الإطار ( outline ) أو لونة أو نوعه في لغة CSS.

  • outline هو إطار خارجي يكون أعلي الأطار الداخلي وهو border يمكن إضافتة معه أو إستخدامة بدونه.
  • outline هو إطار خارجي ولا يعتبر جزء من العنصر بخلاف border فهو جزء من العنصر لأنه يرسم داخل حدود العنصر.

</> CSS Outline VS Border
الفرق بين الإطار الخارجي outline والإطار الداخلي border في لغة CSS

outline هو متشابه إلي حد كبير مع border ولكن هناك بعض الإختلافات التي يجب معرفتها حتي يتثني لك كيفية إختيار أحدهم:

  • outline يكون خارج حدود العنصر مما يؤدي إلي تداخلة مع العناصر المُحيطة أو التي حولة.
  • يمكن أن نتحكم في كل جوانب من جوانب border علي حدة ولا يمكن فعل ذلك مع outline.
  • يمكن أن نتحكم في تدوير زوايا border ولا يمكن فعل ذلك مع outline.
  • يمكن عمل مساحات فارغة بين العنصر وبين outline ولكن هذة الميزة غير موجوده بين العنصر و border.

</> CSS Outline Style
أنواع الإطارات الخارجية outline في لغة CSS

  • dotted - لعمل Outline منقط
  • dashed - لعمل Outline مكون من علامه ال dash -
  • solid - لعمل Outline عادي.
  • double - لعمل Outline مزدوج.
  • groove - لعمل Outline 3D ثلاثي الأبعاد.
  • ridge - لعمل Outline 3D ثلاثي الأبعاد.
  • inset - لعمل Outline 3D ثلاثي الأبعاد.
  • outset - لعمل Outline 3D ثلاثي الأبعاد.
  • none -  لإلغاء Outline الإطار الخارجي.
  • hidden - لعمل Outline مخفي.
مصطلحات الدرس
Outline
Outline

حدود عريضة خارجية

Sytnax
Sytnax

بناء الجملة

Properties
Properties

خصائص

Style
Style

نمط أو شكل

Color
Color

لون

Width
Width

عرض

Offset
Offset

إلتواء

Offset
Offset

إلتواء

Element
Element

عنصر

Dotted
Dotted

حد منقط

Dashed
Dashed

حد متقطع

Solid
Solid

حد عادي

Double
Double

مزدوج

Groove
Groove

حد 3D

Ridge
Ridge

حد 3D

Inset
Inset

حد 3D

Outset
Outset

حد 3D

None
None

لاشئ

Hidden
Hidden

مخفي

اختصارات الدرس
CSS
CSS

Cascading Style Sheets

صفحات الأنماط الانسيابية
HTML
HTML

Hypertext Markup Language

لغة توصيف النص الفائق الخاصة ببناء صفحة الإنترنت
link
معلومات تهمك
  • لا تنسى تقييم الدروس لكي نُحدّث المُحتوى باستمرار حتى ينال إعجابك.
  • لا تنسى مشاركة الموقع مع أصدقاءك حتى تعمّ الفائدة وتكون سبب في نفعهم.
مشاركة
0
0
0
0
عدد المشاركات
هل هذه المعلومات نالت إعجابك ؟
0
0
عدد التقييمات

لديك استفسار ؟

يسعدنا كثيرا مساعدتك في استيعاب افضل للأمور, فلا تترد مطلقا في الاتصال بنا في حال كانت لديك اية اسئله او استفسارات.