Colours and backgrounds · الألوان والخلفيات
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · تحتاج هذه الصفحة إلى متصفح حديث (يدعم SharedArrayBuffer). يرجى تحديث Chrome أو Edge أو Firefox أو Safari إلى أحدث إصدار.
English
Colours
- You can name a colour:
red,blue,green,tomato,gold, and many more. - Or use a hex code like
#2a7ae2— a#followed by six letters/numbers. - Names are easy to remember; hex codes give you millions of exact colours.
العربية
الألوان
- يمكنك تسمية اللون:
red،blue،green،tomato،gold، والعديد من الألوان الأخرى. - أو استخدم رمز سداسي مثل
#2a7ae2— وهو#متبوعًا بستة أحرف/أرقام. - الأسماء سهلة التذكر؛ رموز السداسية تمنحك ملايين الألوان الدقيقة.
English
Backgrounds
colorchanges the text colour.background-colorchanges the colour behind an element.- Put
background-coloronbodyto colour the whole page.
العربية
الخلفيات
colorيغير لون النص.background-colorيغير اللون خلف العنصر.- ضع
background-colorعلىbodyلتلوين الصفحة بالكامل.
<style>
body { background-color: #f3f4f6; }
h1 { color: tomato; }
</style>
<h1>Hello!</h1>
<p>A page with a soft grey background.</p>
English
Common mistakes
colorsets the text;background-colorsets the background.- A colour is a name, a
#rrggbbcode, orrgb(...).
العربية
أخطاء شائعة
colorيحدد النص؛ وbackground-colorيحدد الخلفية.- اللون هو اسم، أو رمز
#rrggbb، أوrgb(...).
English
Now you try
coloris the text;background-coloris behind it.- Colour the page background, then use a hex colour on the heading.
العربية
الآن جرب بنفسك
colorهو النص؛ وbackground-colorخلفه.- لون خلفية الصفحة، ثم استخدم لونًا سداسيًا على العنوان.
Give the whole page a soft background. Add body { background-color: lightyellow; }. · أعطِ الصفحة خلفية ناعمة. أضف body { background-color: lightyellow; }.
Colour the heading with a hex code. Add h1 { color: #2a7ae2; } (that's a blue). · لون العنوان برمز سداسي. أضف h1 { color: #2a7ae2; } (هذا أزرق).