CSS Background Color
خلفية لون في لغة CSS
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
CSS Background Color
خلفية لون في لغة CSS
</>
CSS Backgrounds
خلفية لون في لغة CSS
- قيمة خاصية background-color يمكن أن تكون hex color أو RGB color أو color name.
- يمكن تعيين لون شفاف عن طريق RGBA color.
- الخلفيات يتم إضافتها علي مساحة العنصر بالكامل وتشمل جميع الفراغات الداخلية padding.
قيم خاصية background-color property:
- color إضافة اللون مباشرة hex color أو RGB color أو color name.
- transparent سوف يصبح العنصر بخلفية شفافة وستظهر خلفية عنصر الأب parent االعنصر الزي يتفرع منه.
- inherit سوف يورث العنصر الخلفية من الأب parent العنصر الزي يتفرع منه.
background color syntax
طريقة كتابة خاصية background color.
h1
{
background-color:value;
}
</>
CSS background-color with color name
خاصية background-color والقيمة color name في لغة CSS
background-color syntax
طريقة إستخدام color name مع خاصية background-color.
background-color:yellow;
set h1 background color
إضافة خلفية لعنصر h1 بلغة CSS.
h1
{
background-color:yellow;
}
body background color
إضافة خلفية لعنصر body بلغة CSS.
body
{
background-color:pink;
}
</>
CSS background-color with transparent
خاصية background-color والقيمة transparent في لغة CSS
background color transparent
تظهر خلفية العنصر خلفية العنصر الخلفي وهو parent.
body
{
background-color:pink;
}
h1
{
background-color:transparent;
}
</>
CSS background-color with opacity
خاصية background-color والقيمة opacity في لغة CSS
إستخدام opacity كقيمة مع خاصية background-color في لغة CSS وهي طريقة تعيين خلفية شفافة ومُتدرجة وهي توضح لون خلفية العنصر الأب parent Element.
- أقل قيمة للشافية هي 0.1 وأعلي قيمة هي 1.
background color opacity
اللون الأزرق شفاف مُتدرج تقل درجة وضوح الخلفية بنسبة 50% مع opacity.
h1
{
background-color:blue;
opacity: 0.5;
}
ملاحظة
</>
CSS background-color with RGB
خاصية background-color والقيمة RGB في لغة CSS
إستخدام RGB كقيمة مع خاصية background-color في لغة CSS وهي طريقة تعيين خلفية للعنصر عن طريق RGB وليس color name أو hex color.
background color RGB
تعيين خلفية بأستخدام قيمة RGB بدلاً من color name.
body
{
background-color: rgb(0, 255, 0);
}
</>
CSS background-color with RGBA
خاصية background-color والقيمة RGBA في لغة CSS
إستخدام RGBA كقيمة مع خاصية background-color في لغة CSS وهي طريقة تعيين خلفية للعنصر وتعديل درجة الشفافية عن طريق RGBA.
background color RGBA
تعيين خلفية بأستخدام قيمة RGB بدلاً من color name.
body
{
background-color: rgb(255, 0, 0,0.5);
}
</>
CSS background-color with hex color
خاصية background-color والقيمة hex color في لغة CSS
إستخدام hex color كقيمة مع خاصية background-color في لغة CSS وهي طريقة تعيين خلفية للعنصر عن طريق hex code.
background color hex
تعيين خلفية بأستخدام قيمة hex بدلاً من color name.
body
{
background-color:#00ff00;
}
</>
CSS background-color with inherit
خاصية background-color والقيمة inherit في لغة CSS
إستخدام inherit كقيمة مع خاصية background-color في لغة CSS وهي طريقة تعيين خلفية للعنصر عن طريق الوراثه من العنصر الأب parent طريق inherit.
background color inherit
تعيين خلفية بأستخدام قيمة inherit بدلاً من color name.
body
{
background-color: pink;
}
h1
{
background-color: inherit;
}
p
{
background-color: red;
}
لون الخلفية
عناصر
خاصية
اسم اللون
الشفافية
شفافية
قيمة
بإستخدام
Cascading Style Sheets
صفحات الأنماط الانسيابيةHexadecimal
أرقام سداسية عشريةRed، Green، Blue
أحمر , أخضر , أزرق
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم البرمجة. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال البرمجة. مهمتنا ليست فقط تعليم البرمجة، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
