خصوصيات background CSS
- الصفحة السابقة backface-visibility
- الصفحة التالية background-attachment
تعريف الاستخدام
background
الصيغة القصيرة لتعيين جميع خصائص الخلفية في بيانة واحدة.
يمكن تعيين الصفات التالية:
- background-color
- background-position
- background-size
- background-repeat
- background-origin
- background-clip
- background-attachment
- background-image
إذا لم يتم تعيين أحد القيم، لن يحدث مشكلة، على سبيل المثال background:#ff0000 url('smiley.gif'); مسموح به أيضًا.
يُنصح عادةً باستخدام هذه الخاصية بدلاً من استخدام خصائص فرعية، لأن هذه الخاصية تدعم المتصفحات القديمة بشكل أفضل وتقلل من عدد الحروف التي يجب كتابتها.
انظر أيضًا:
دليل CSSخلفية CSS،خلفيات CSS (متقدم)
دليل HTML DOMخصائص background
مثال
كيفية تعيين جميع خصائص الخلفية في بيان واحد:
body { background: #00FF00 url(bgimage.gif) no-repeat fixed top; }
قواعد اللغة CSS
background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
قيمة الخاصية
القيمة | الوصف | CSS |
---|---|---|
background-color | يحدد اللون الذي سيتم استخدامه كخلفية. | 1 |
background-position | يحدد موقع الصورة الخلفية. | 1 |
background-size | يحدد حجم الصورة الخلفية. | 3 |
background-repeat | يحدد كيفية تكرار الصورة الخلفية. | 1 |
background-origin | يحدد منطقة تحديد الصورة الخلفية. | 3 |
background-clip | يحدد منطقة رسم الخلفية. | 3 |
background-attachment | يحدد ما إذا كانت الصورة الخلفية ثابتة أو تتحرك مع باقي الصفحة. | 1 |
background-image | يحدد الصورة الخلفية التي سيتم استخدامها. | 1 |
inherit | يحدد أن يجب استيراد إعدادات background من العنصر الأم. | 1 |
تفاصيل التقنية
القيمة الافتراضية: | لم يتم تحديد |
---|---|
تنقلية: | لا |
الإصدار: | CSS1 + CSS3 |
قواعد اللغة JavaScript: | object.style.background="white url(paper.gif) repeat-y" |
دعم المتصفح
الرقم في الجدول يوضح إصدار المتصفح الأول الذي يدعم هذه الخاصية بشكل كامل.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
- الصفحة السابقة backface-visibility
- الصفحة التالية background-attachment