تغییر رنگ و تصویر زمینه عناصر HTML با CSS

برای قرار دادن یک تصویر به عنوان زمینه صفحه باید از تگ BODY  استفاده کرد.وقتی که تگ BODY را پیدا کردید ممکن است به صورت ساده  باشد یا با فرمانهایی که به آن اضافه شده است. مانند زیر:

کاری که شما باید انجام دهید، اضافه کردن یک شناسه به تگ BODY  است. بنابراین یک فاصله بعد از آخرین فرمان بگذارید و سپس این  فرمان را وارد کنید:

اکنون تگ BODY شما باید به این صورت باشد (اگر فرمانهای دیگری  به آن اضافه نکرده باشید):

حالا باید آدرس عکس را بین دو دابل کوت قرار دهیم. برای این کار  دو راه وجود دارد:

• برای این کار اگر صفحه و عکس در یک مسیر هستند می توانیم  فقط نام کامل عکس با پسوند آنرا بنویسیم. مثلاً:

• اگر از قرار داشتن صفحه و عکس در یک مسیر مطمئن نیستید یا  عکس و صفحه در یک مسیر نیستند می توانید از آدرس کامل عکس  استفاده کنید.

تصاویر برای زمینه باید با یکی از دو فرمت GIF یا JPG باشند.  اگر عکس به این صورت نبود باید آن را با برنامه ای مثل Paint Shop  Pro یا Photoshop به یکی از این فرمتها تبدیل کرد.
 

برای مثال فرض کنید یک عکس با نام background.jpg داریم که در  این مسیر قرار دارد: http://www.mysite.com/img . حال اگر بخواهیم  صفحه ای را در پوشه ای به غیر از پوشه img در این سایت طراحی کنیم  باید از آدرس کامل عکس یعنی  http:www.mysite.com/img/background.jpg استفاده کنیم. و تگ BODY  ما به این صورت در می آید:

ما برای تعیین تصویر زمینه این صفحه قبلاً از این تگ استفاده می  کرده ایم:

اما اگر بخواهیم صفحه را به پوشه img منتقل کرده یا صفحه جدیدی  را در پوشه img طراحی کنیم می توانیم از نام عکس یعنی:  background.jpg استفاده کنیم و تگ BODY ما به این صورت در می آید:

برای تغییر دادن تصویر زمینه روش دیگر هم وجود دارد که استفاده  از CSS است. در مورد این روش می تونید مطالب بیشتری را در این  صفحات مطالعه کنید: تغییر  رنگ زمینه قسمتهای مختلف صفحه با CSS و کار  با تصویر زمینه در طراحی صفحات با CSS