این ویژگی به ما اجازه
می دهد تا تقریباً برای هر چیزی در صفحه
رنگ زمینه مشخص کنیم. برای این کار باید
این ویژگی را به همراه رنگ مورد نظر وارد
تگ مربوط به قسمت مورد نظر کنیم. اگر
بخواهیم زمینه قسمتی از یک متن را مشخص
کنیم می توانیم از این ویژگی در یک تگ
SPAN در اطراف متن مورد نظر استفاده کنیم.
در مثال زیر زمینه
قسمتی از یک متن را به رنگ زرد در می
آوریم:
<p>متن بدون زمینه.
<span style="background-color:
yellow">این قسمت زمینه زرد
دارد.</span></p>
این هم متن نهایی:
متن بدون زمینه.
این قسمت زمینه زرد دارد.
همینطور می توانیم از
این ویژگی برای تغییر زمینه یک جدول یا
DIV هم استفاده کنیم:
شما حتی می توانید از
این ویژگی برای سلولهای یک جدول به صورت
جداگانه استفاده کنید.
یک نمونه دیگر از موارد
استفاده این ویژگی در طراحی فرمهاست. به
مثال زیر توجه کنید:
<form
action="some_script>
نام : <input type="text" size="30"
style="background-color: #009900">
</form>
این هم فرم آزمایشی ما:
نام :
توجه داشته باشید که در
این ویژگی هم می توانیم از نام رنگ ها و
هم از
معادل هگزادسیمال آنها استفاده کنیم.
شما می توانید با
استفاده از این ویژگی در تگ body رنگ
زمینه صفحه را هم تغییر دهید. در مورد
تصویر زمینه هم که در قسمت بعد به آن می
پردازیم می توان به همین صورت عمل کرد.
background-image
این ویژگی برای مشخص
کردن تصویر زمینه به کار می رود.کاربرد
background-image همانند
background-color است با
این تفاوت که به جای مشخص کردن رنگ باید
یک تصویر را تعیین کنیم. این ویژگی به
صورت زیر نوشته می شود.
background-image:url(آدرس تصویر مورد
نظر)
بعد از نام ویژگی باید
از url برای مشخص کردن آدرس تصویر استفاده
کنیم. آدرس تصویری که می خواهیم به عنوان
زمینه استفاده کنیم نیازی نیست بین
علامتهای نقل قول ( " ) قرار گیرد ولی
باید بین دو پرانتز قرار گیرد.
به یک مثال در این رابطه توجه کنید:
<span
style="background-image:
url(http://www.neopersia.org/css/example1.gif)">برای
این span از تصویر زمینه استفاده شده
است.</span>
می توانید نتیجه کد
بالا را مشاهده کنید:
برای این span از تصویر زمینه استفاده شده
است.
از این ویژگی می توان
تقریباً برای همه اجزای صفحه استفاده کرد.
در اینجا برای یک جدول از آن استفاده کرده
ایم:
همانطور که برای text
box از رنگ زمینه استفاده کردیم برای آن
از تصویر زمینه هم می توانیم استفاده
کنیم. در اینجا از این ویژگی برای یک
textarea استفاده می کنیم: