در css، یکی از روشهای تغییر اندازهی تصویر زمینه متناسب با سایز صفحه نمایش استفاده از خاصیت background-size است.
اگر مقدار این خاصیت را برابر cover قرار دهید، تصویر بصورت خودکار و بر اساس سایز کل صفحه بطور کامل به عنوان تصویر زمینه قرار میگیرد. توجه داشته باشید که با این روش تصویر کشیده نمیشود و متناسب با سایز دستگاه بخشهایی از آن ممکن است نمایش داده نشود.
بصورت زیر میتوانید ازین خاصیت استفاده کنید.
body {
background: url('http://bayanbox.ir/view/3671047358495111419/the-eiffel-tower-by-gemini-soul-d6s3rug.jpg') no-repeat fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
همچنین مثال بالا را بصورت زنده میتوانید در فیدلی که برای این پست ساخته شده امتحان کنید. فیدل امتحان این ویژگی...
همچنین گزینه های بیشتری هم برای background-size در دسترس است که میتوانید در MDN بیشتر مطالعه کنید. بیشتر ...