سبد (0)

تبلیغات

خصوصیت background

مثال (خصوصیت background)

تنظیم کلیه خصوصیت های مربوط به پس زمینه، در یک مرحله:

body
{
background: #00ff00 url('smiley.gif') no-repeat fixed center;
}
خودتان امتحان کنید »

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت background را پشتیبانی می کنند.

توجه: مرورگر Internet Explorer 8 و نسخه های قبلی آن، تنظیم چند پس زمینه برای یک عنصر را پشتیبانی نمی کند.

توجه: مرورگر Internet Explorer 7 و نسخه های قبلی آن، مقدار "inherit" را پشتیبانی نمی کند. IE8 به !DOCTYPE! نیاز دارد. IE9 مقدار "inherit" را پشتیبانی می کند.


تعریف و کاربرد

از خصوصیت background می توانید برای مختصر نویسی خصوصیت های مربوط به پس زمینه استفاده نمایید.

خصوصیت هایی که می توایند تنظیم نمایید:

  1. background-color
  2. background-position
  3. background-size
  4. background-repeat
  5. background-origin
  6. background-clip
  7. background-attachment
  8. background-image

توجه: اهمیتی ندارد که یکی از مقادیر بالا ذکر نشود، تنها رعایت ترتیب مقادیر مهم است.

مقدار پیشفرض see individual properties
ارث بری خیر
نسخه CSS1 + new properties in CSS3
JavaScript ساختار object.style.background="red url(smiley.gif) top left no-repeat"

نحوه استفاده

background: color position size repeat origin clip attachment image;
مقدار توضیحات CSS
background-color رنگ پس زمینه یک عنصر را تنظیم می کند. 1
background-position شروع مکان قرارگیری عکس پس زمینه را تنظیم می کند. 1
background-size اندازه تصویر پس زمینه را تنظیم می کند. 3
background-repeat چگونگی تکرار عکس پس زمینه را تنظیم می کند. 1
background-origin ناحیه قرار گیری عکس پس زمینه را مشخص می کند. (تصویر پس زمینه می تواند در قسمت محتوی (content-box)، لبه (border-box) و یا مکان (padding-box) قرار گیرد) 3
background-clip ناحیه رنگ آمیزی پس زمینه را مشخص می کند. 3
background-attachment مکان عکس پس زمینه با Scroll خوردن صفحه حفظ شود یا نه  
background-image عکس های پس زمینه را تنظیم می کند. 1

بیاموزهای مرتبط

Styling Backgrounds (بیاموز CSS)

CSS3 Background (بیاموز CSS3)

HTML DOM reference: background property

دیدگاه‌ها  

0 # masuod 1395-11-15 22:57
سلام
ممنونم از سایت آموزشیتون خیلی عالی دستتان درد نکنه
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی