بسم الله الرحمن الرحيم

خلفية صفحة الويب- background-image

سوف نتعلم اليوم القيام بعمل خلفية كاملة لصفحة الويب باستخدام css.

في قسم style في المحرر نقوم بتنسيق الأمر body أولا نضع الأمر background-image بهذا الشكل :

نهتم هنا بمسار الصورة المراد إدراجها فمثلا الصورة هنا توجد في مجلد img ثم أضع اسم الصورة blue ثم نوعها jpg .

ثانيا :  نستخدم الأمر  background-position بهذا الشكل :

 خاصية background-position تقوم بعيين موقع الخلفية المستخدمة . الموضع الأساسي اللذي يتم تعيينه من دون استخدام  هذه الخاصية هو أعلى يسار الصفحة  top left ثم إعادة تكرار الصورة عموديا وأفقيا .

ثالثا: خاصية background-repeat  :

وتستخدم في تكرار repeat الصورة عموديا repeat-y أو أفقيا repeat-x  أو عدم تكرارها no-repeat  .

رابعا: خاصية background-size :

تستخدم لتعيين مقاس الصورة المستخدمة في الخلفية cover يقوم بتكبير الصورة بقدر صفحة الويب كاملة  .

خامسا: خاصية background-attachment:

تستخدم في جعل الصورة ثابتة fixed أو جعلها كقائمة متحركة scroll .

أخيرا : هذه الأوامر الخمسة المستخدمة في جعل الصورة كخلفية كاملة لصفحة الويب لتظهر لنا هذه النتيجة:

 

لتحميل الملف :
https://www.mediafire.com/?8mm0oitaez5t6ac