CSS Background Shorthand
إختصارات خاصية background في لغة CSS
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
CSS Background Shorthand
إختصارات خاصية background في لغة CSS
</>
CSS Background Shorthand
إختصارات خاصية background في لغة CSS
في لغة CSS يمكن أختصار جميع الخصائص [<background-color>] [<background-image>] [<background-position>]/[<background-size>] [<background-repeat>] [<background-origin>] [<background-clip>] [<background-attachment>] [<initial|inherit>] بداخل خاصية واحدة وهي background وتكتب جميع القيم بالترتيب بداخلها بدلاً من قيمة واحدة.
Background Shorthand syntax
يتم صف القيم بهذا الترتيب حتي تعمل جميع الخصائص بطريقة صحيحة مع إختصار background.
background: [<background-color>] [<background-image>] [<background-position>]/[<background-size>] [<background-repeat>] [<background-origin>] [<background-clip>] [<background-attachment>] [<initial|inherit>];
CSS Background without Shorthand
بدون إختصارة تكتب جميع الخصائص كاملة بدلاً من إستخدام الأختصار background.
body { background-color: pink; background-image:url('https://www.closetag.com/images/background.jpg'); background-position: right top; background-attachment:fixed; background-size:100px; background-repeat: no-repeat; }
</>
CSS background property
خاصية background في لغة CSS
تستخدم خاصية background في لغة CSS لأختصار جميع خصائص الخلفيات في لغة CSS يمكن أختصار جميع الخصائص [<background-color>] [<background-image>] [<background-position>]/[<background-size>] [<background-repeat>] [<background-origin>] [<background-clip>] [<background-attachment>] [<initial|inherit>] بداخل خاصية واحدة وهي background,ويتم كتابة جميع القيم بداخلها.
CSS Background without Shorthand
إختصارة جميع الخصائص في خاصية واحده وهي background.
body { background:pink url('https://www.closetag.com/images/background.jpg') right top / 100px 100px fixed no-repeat; }
CSS Background less Shorthand
ليس من الضروري كتابة جميع الأختصارات يمكن أستخدام خاصية واحدة أو أكثر علي حسب الأحتياج لا داعي لكتابة جميع القيم.
body { background:pink url('https://www.closetag.com/images/background.jpg') no-repeat; }