انتقل إلى محتوى الدرس

CSS background percentage size ضبط حجم الصورة بالنسبة المئوية في لغة CSS

ستتعلم في هذا الدرس كيفية ضبط أبعاد أو حجم صور الخلفيات بإستخدام خاصية  background-size وستتعلم جميع القيم التي تُعين لهذة الخاصية في لغة CSS.

1 صفوف تعليمية
لغة CSS
6,688 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

عن طريق إسخدام القيمة percentage مع خاصية background-size فسوف يتم تعيين أبعاد ( طول وعرض ) بحجم محدد بالنسبة المئوية في لغة CSS.

  • يمكن التحكم في طول وعرض بقيم مختلفة وهي كتابة قيمتين في خاصية background-size لتصبح ;background-size:100% 70% حيث أن القيمة الأولي للعرض والثانية للطول.

CSS background percentage size

تظهر الصورة بحجم محدد بأستخدام قيم وحدة pixel مع خاصية background size.

HTML
body
{
background-image:url("https://www.closetag.com/images/background.jpg");
background-size:50%;
}

CSS background size percentage height and width

يتم تعيين قيميتين مع خاصية background-size قيمة للعرض وقيمة للطول بالنسبة المئوية.

HTML
body
{
background-image:url("https://www.closetag.com/images/background.jpg");
background-size:100% 70%;
}