نمونه کد

مثالی برای تکرار شدن یک عکس پس زمینه (فقط) به صورت عمودی:

آزمایشگاه

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

خصوصیت background-repeat مشخص می کند که آیا عکس پس زمینه تکرار شود یا خیر.

اطلاعات

# توضیحات
مقدار پیشفرض repeat
ارث بری خیر
انیمیشن خیر
نسخه CSS1
نگارش JS object.style.backgroundRepeat="repeat-x"

سازگاری با مرورگر

اعداد نوشته شده در جدول نسخه ای از مرورگر را مشخص می کنند که به طور کامل قابلیت پشتیبانی از خصوصیت background-repeat را دارند.

# کروم ادج فایرفاکس سافاری اپرا
background-repeat

شیوه نگارش

مقادیر

مقادیر توضیحات
repeat عکس پس زمینه دائما تکرار می شود و کل فضا را در بر میگیرد
repeat-x عکس پس زمینه به صورت عمودی تکرار می شود.
repeat-y عکس پس زمینه به صورت افقی تکرار می شود.
no-repeat عکس پس زمینه تکرار نمیشود.
space تصویر پس زمینه تا حد امکان بدون برش تکرار می شود.
round عکس پس زمینه در اطراف فضای موجود تکرار میشود.
initial این مقدار را به خصوصیت از پیش تأیین شده خود اضافه می کند.
inherit این مقدار را از تگ اصلی خود به ارث می برد.

نمونه کد های بیشتر

نمونه کد

مثالی برای تکرار شدن عکس پس زمینه به دو صورت افقی و عمودی (این بخش به صورت پیش فرض میباشد):

آزمایشگاه

نمونه کد

مثالی برای تکرار شدن عکس پس زمینه (فقط) به صورت افقی:

آزمایشگاه

نمونه کد

مثالی برای عدم تکرار عکس پس زمینه.تصویر (فقط) برای یک بار نمایش داده میشود:

آزمایشگاه

نمونه کد

استفاده از Background-repeat: space و background-repeat: round:

آزمایشگاه

نمونه کد

مثالی برای استفاده از خصوصیت های مختلف پس زمینه برای ساخت یک تصویر ویژه:

آزمایشگاه

صفحات مرتبط

آموزش CSS: پس زمینه CSS

مرجع CSS: ویژگی background-position

مرجع HTML DOM: ویژگی backgroundRepeat