انتقل إلى محتوى الدرس
ابدأ رحلتك
الدرس 34
دورة لغة CSS

عرض الإطار في لغة CSSCSS Border Width

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

ابدأ التعلّم استكشف الأمثلة
أقسام الدرس
5
الأمثلة
6
اللغة
العربية
تاريخ النشر
غير محدد
المشاهدات
4,279
محتوى الدرس
في هذا الدرس 5تصفّح المواضيع

CSS Border Width عرض الإطار في لغة CSS

خاصية border-width في لغة CSS تُستخدم لتُحدد عرض border الإطار من الاربع جوانب [left-right-top-bottom] بجانب خاصية border-style.


قيم خاصية border-width في لغة CSS:

  • medium هو الحجم الأفتراضي لعرض الإطار وهو متوسط الحجم.
  • thin لتحديد عرض الإطار بشكل رفيع.
  • thick لتحديد عرض الإطار بشكل سميك. 
  • length لتحديد عرض الإطار بوحدات pixel أو em او % أو cm أو rem.

border-width syntax

طريقة كتابة خاصية border-width في لغة CSS.

HTML 
border-width:value;

border-width values

قيم خاصية border-width في لغة CSS.

HTML 
border-width:medium|thin|thick|length|initial|inherit;

CSS border width with medium خاصية border-width مع القيمة medium في لغة CSS

تُستخدم خاصية border-width مع القيمة medium لتحديد عرض border بسُمك متوسط في لغة CSS وهو الحجم الأفتراضي بدون إستخدام عرض للإطار.

CSS border width with medium

خاصية border-width والقيمة medium في لغة CSS.

HTML 
.medium
{
 border-style:solid;
 border-width:medium;
}
جرّب بنفسك

CSS border width with thin خاصية border-width مع القيمة thin في لغة CSS

تُستخدم خاصية border-width مع القيمة thin لتحديد عرض border بسُمك رفيع في لغة CSS.

CSS border width with thin

خاصية border-width والقيمة thin في لغة CSS.

HTML 
.thin
{
 border-style:solid;
 border-width:thin;
}
جرّب بنفسك

CSS border width with thick خاصية border-width مع القيمة thick في لغة CSS

تُستخدم خاصية border-width مع القيمة thick لتحديد عرض border بسُمك عريض في لغة CSS.

CSS border width with thick

خاصية border-width والقيمة thick في لغة CSS.

HTML 
.thick
{
 border-style:solid;
 border-width:thick;
}
جرّب بنفسك

CSS border width with length خاصية border-width مع القيمة length في لغة CSS

تُستخدم خاصية border-width مع القيمة thick لتحديد عرض border بسُمك عريض في لغة CSS.

CSS border width with length

خاصية border-width والقيمة length في لغة CSS.

HTML 
.length
{
 border-style:solid;
 border-width:5px;
}
جرّب بنفسك

مشاركة

هل كان هذا الدرس مفيدًا؟

جارٍ تحميل الآراء…

ابنِ لغتك البرمجية

المصطلحات12

راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.

0 / 12 مفهومةأول بطاقة، أول خطوة
01 Width عرض
للمراجعة
02 Border حد
للمراجعة
03 Borders حدود
للمراجعة
04 Property خاصية
للمراجعة
05 Medium وسط
للمراجعة
06 Thin نحيف
للمراجعة
07 Thick سميك
للمراجعة
08 Specific Side Widths علروض جانبية محددة
للمراجعة
09 Top أعلي
للمراجعة
10 Right يمين
للمراجعة
11 Bottom أسفل
للمراجعة
12 Left يسار
للمراجعة

اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.

حروف قليلة. معنى كامل.

الاختصارات1

راجع المعنى، اشرحه لنفسك، ثم علّم البطاقة كمفهومة.

0 / 1 مفهومةأول بطاقة، أول خطوة
01 CSS CSS
Cascading Style Sheets
صفحات الأنماط الانسيابية
للمراجعة

اقرأ البطاقات بحرية. سجّل الدخول لحفظ تقدم مراجعتك.

مساحة التحدي

اختبر فهمك.
ووصلها للإتقان.

كل سؤال خطوة لقدّام. اختار، اكتب كود، وشوف نتيجتك فورًا.

3أسئلة 2أنواع تحديات 100%هدف الإتقان
تصحيح تلقائي. فرص بلا حدود.

أكمل المهام، واجمع كل الإجابات الصحيحة. أقل من 100%؟ راجع وأعد المحاولة.

الأسئلة متاحة للاطلاع. سجّل الدخول للتفاعل وحفظ تقدمك.

لمحة عن التحدي3 أسئلة تنتظرك
01

اي من القيم الاتية ليس وحدة قياس تستخدم في تحديد عرض الاطار (in,m, px, pt, cm, em, etc) ؟

____
02

ماهي الخاصية التي تستخدم في تحديد عرض الاطار ؟

____
03

أي من الاختيارات التالية هو الترتيب الصحيح لموضع القيم التي تأخذها خاصية border-width باستخدام ال shorthand ؟