سبد (0)

خصوصیت background-color

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

تنظیم رنگ پس زمینه چند عنصر مختلف: (در انتهای این بیاموز، مثال های بیشتری را خواهید دید)

body
{
background-color:yellow;
}
h1
{
background-color:#00ff00;
}
p
{
background-color:rgb(255,0,255);
}
خودتان امتحان کنید »

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

با استفاده از خصوصیت background-color می توانید رنگ پس زمینه یک عنصر را تنظیم نمایید.

پس زمینه یک عنصر، شامل padding و border نیز می شود. (اما margin جزو آن نیست)

مقدار پیشفرض transparent
ارث بری خیر
نسخه CSS1
JavaScript ساختار object.style.backgroundColor="#00FF00"

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

Internet Explorer Firefox Opera Google Chrome Safari

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

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


نکته ها و ترفندها

توجه: زمانی که از عکس یا رنگ پس زمینه استفاده می کنید، توجه داشته باشید که عکس مورد نظر باعث ناخوانایی متن نشود.


مقدارهای خصوصیت

مقدارتوضیحاتنمایش دادن
color برای مشاهده لیست رنگ ها، به لینک HTML Colors مراجعه نمایید. نمایش دادن »
transparent تعیین می کند که رنگ پس زمینه باید ناپیدا (transparent) باشد. transparent مقدار پیشفرض است. نمایش دادن »
inherit تعیین می کند که باید از والدش، ارث بری داشته باشد.  

مثالs

مثال - خودتان امتحان کنید

تنظیم background-color قسمتی از یک متن
این مثال، نشان می دهد که چگونه رنگ پس زمینه قسمتی از یک متن را تنظیم نماییم.


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

Styling Backgrounds (بیاموز CSS)

HTML DOM reference: backgroundColor property

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان