پس‌زمینه HTML

پس‌زمینه خوب باعث می‌شود که وب‌سایت به نظر برسد که بسیار زیبا است.

مثال

رنگ پس‌زمینه و رنگ متن که با هم ترکیب شده‌اند
مثالی از رنگ پس‌زمینه و رنگ متن که با هم ترکیب شده‌اند، باعث می‌شود که خواندن متن در صفحه آسان شود.
رنگ پس‌زمینه و رنگ متن که با هم ترکیب نشده‌اند
مثالی از رنگ پس‌زمینه و رنگ متن که با هم ترکیب نشده‌اند، باعث می‌شود که خواندن متن در صفحه سخت شود.

（مثال‌های بیشتری در پایین این صفحه پیدا می‌شود。）

پس‌زمینه‌ها (Backgrounds)

<body> دارای دو تگ تنظیم پس‌زمینه است. پس‌زمینه می‌تواند رنگ یا تصویر باشد.

رنگ پس‌زمینه (Bgcolor)

ویژگی رنگ پس‌زمینه را تنظیم می‌کند که پس‌زمینه به رنگ خاصی در می‌آید. مقادیر ممکن شامل عدد هشتمی، مقادیر RGB یا نام رنگ است.

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

تمام کد‌های بالا رنگ پس‌زمینه را به سیاه تنظیم می‌کنند.

پس‌زمینه (Background)

ویژگی پس‌زمینه تصویر پس‌زمینه را تنظیم می‌کند. مقدار این ویژگی URL تصویر است. اگر اندازه تصویر کوچکتر از پنجره مرورگر باشد، تصویر در کل پنجره مرورگر کپی می‌شود.

<body background="clouds.gif">
<body background="http://www.codew3c.com/clouds.gif">

URL می‌تواند آدرس مربوط به مسیر باشد، مانند خط اول کد. همچنین می‌تواند آدرس کامل باشد، مانند خط دوم کد.

نکته:اگر قصد دارید از تصویر پس‌زمینه استفاده کنید، باید چند نکته را به یاد داشته باشید:

  • آیا تصویر پس‌زمینه زمان بارگذاری صفحه را افزایش داده است. نکته: فایل‌های تصویر نباید بیشتر از 10k باشند.
  • آیا تصویر پس‌زمینه با سایر تصاویر در صفحه هماهنگ است؟
  • آیا تصویر پس‌زمینه با رنگ‌های متن در صفحه هماهنگ است؟
  • آیا پس از چیدمان تصاویر در صفحه، به نظر خوب می‌رسند؟
  • آیا توجه به متن از تصویر پس‌زمینه پر شده است؟

نکات اولیه - نکات مفید:

ویژگی‌های پس‌زمینه (bgcolor)، پس‌زمینه (background) و متن (text) در برچسب <body> در استانداردهای جدیدترین HTML (HTML4 و XHTML) منسوخ شده‌اند. W3C این ویژگی‌ها را در استانداردهای پیشنهادی خود حذف کرده است.

باید از جدول استایل‌های پیچیده (CSS) برای تعریف چیدمان و ویژگی‌های نمایشی عناصر HTML استفاده کرد.

مثال‌های بیشتر

تصاویر پس‌زمینه با کیفیت بالا
مثال‌هایی که در آن‌ها تصاویر پس‌زمینه و رنگ‌های متن باعث راحتی خواندن متن صفحات می‌شوند.
تصاویر پس‌زمینه با کیفیت بالا 2
مثال دیگری از تصاویر پس‌زمینه و رنگ‌های متن که باعث راحتی خواندن متن صفحات می‌شوند.
تصاویر پس‌زمینه با کیفیت پایین
مثال‌هایی که در آن‌ها تصاویر پس‌زمینه و رنگ‌های متن باعث دشواری خواندن متن صفحات می‌شوند.