خصائص background-size CSS

التعريف والاستخدام

background-size خصائص تحديد حجم صورة الخلفية.

تحديد حجم صورة الخلفية:

div
{
background:url(img_flwr.gif);
background-size:80px 60px;
background-repeat:no-repeat;
}

background-size: length|percentage|cover|contain;

القيمة	الوصف	الاختبار
length	تعيين الارتفاع والعرض لصورة الخلفية. القيمة الأولى تعيين العرض، والقيمة الثانية تعيين الارتفاع. إذا تم تعيين قيمة واحدة فقط، فإن القيمة الثانية ستتم تعيينها على "تلقائي".	الاختبار
percentage	تعيين عرض وارتفاع صورة الخلفية كنسبة مئوية من العنصر الأم. القيمة الأولى تعيين العرض، والقيمة الثانية تعيين الارتفاع. إذا تم تعيين قيمة واحدة فقط، فإن القيمة الثانية ستتم تعيينها على "تلقائي".	الاختبار
cover	توسيع صورة الخلفية لتحقيق تغطية منطقة الخلفية بالكامل. قد لا يتم عرض بعض أجزاء صورة الخلفية في منطقة التركيز الخلفية.	الاختبار
contain	توسيع الصورة لتحقيق أقصى حجم، لجعل عرضها وارتفاعها يتماشى تمامًا مع منطقة المحتوى.	الاختبار

القيمة الافتراضية:	تلقائي
التنسيق:	لا
الإصدار:	CSS3
جافا سكربت الجملة:	object.style.backgroundSize="60px 80px"

تمدد صورة الخلفية: تمدد صورة الخلفية لتمديد تغطية منطقة المحتوى بالكامل.
تمدد صورة الخلفية للنسخ الأفقية لصورة الخلفية أربعة مرات: تمدد صورة الخلفية لتحقيق نسخة أفقية لصورة الخلفية أربعة مرات.

الرقم في الجدول يوضح إصدار المتصفح الأول الذي يدعم الخاصية بشكل كامل.

Chrome	Edge	Firefox	Safari	Opera
Chrome	IE / Edge	Firefox	Safari	Opera
4.0 1.0 -webkit-	9.0	4.0 3.6 -moz-	4.1 3.0 -webkit-	10.5 10.0 -o-