سی ایس ایل بیک گراؤنڈ-سائز
- پچھلے پار بیک گرونڈ ریپیٹ
- پائیدھی پار بلاک سائز
تعریف و استفاده
background-size ویژگیای که اندازه عکس پسزمینه را مشخص میکند.
لطفاً به اینجا نیز مراجعه کنید:
دستورالعمل CSS:CSS پس منظروپشتیبانی پسزمینه CSS (پیشرفته)
دستورالعمل HTML DOM:ویژگی backgroundSize
مثال
اندازه عکس پسزمینه را مشخص میکند:
div
{
background:url(img_flwr.gif);
background-size:80px 60px;
background-repeat:no-repeat;
}
قوانین CSS
background-size: اندازه|درصد|پوشش|محتوی;
مقدار ویژگی
| مقدار | توضیح | آزمایش |
|---|---|---|
| اندازه |
ارتفاع و عرض عکس پسزمینه را تنظیم میکند. مقدار اول عرض را تنظیم میکند، مقدار دوم ارتفاع را تنظیم میکند. اگر تنها یک مقدار تنظیم شود، مقدار دوم به "خودکار" تنظیم میشود. |
آزمایش |
| درصد |
عرض و ارتفاع عکس پسزمینه را به عنوان درصد از عنصر والد تنظیم میکند. مقدار اول عرض را تنظیم میکند، مقدار دوم ارتفاع را تنظیم میکند. اگر تنها یک مقدار تنظیم شود، مقدار دوم به "خودکار" تنظیم میشود. |
آزمایش |
| پوشش |
عکس پسزمینه را به اندازه کافی گسترش دهید تا عکس پسزمینه به طور کامل محدوده پسزمینه را پوشش دهد. بخشهای خاصی از عکس پسزمینه ممکن است در محدوده قرارگیری پسزمینه نمایش داده نشوند. |
آزمایش |
| محتوی | عکس را به اندازه بزرگترین اندازه ممکن گسترش دهید تا عرض و ارتفاع آن به طور کامل با محدوده محتوایی سازگار باشند. | آزمایش |
جزئیات فنی
| مقدار پیشفرض: | خودکار |
|---|---|
| نسبتدهی: | خیر |
| نسخه: | CSS3 |
| قوانین جاوااسکریپت: | عنصر.style.backgroundSize="60px 80px" |
مثالهای بیشتر
- عکس پسزمینه را کشش دهید
- عکس پسزمینه را کشش دهید تا به طور کامل محدوده محتوایی را پوشش دهد.
- عکس پسزمینه را کشش دهید تا عکس پسزمینه به طور افقی چهار بار کپی شود
- عکس پسزمینه را کشش دهید تا عکس پسزمینه به طور دقیق چهار بار به صورت افقی کپی شود.
پشتیبانی مرورگر
اعداد در جدول نشاندهنده نسخه اولین مرورگر پشتیبان از این ویژگی هستند.
| کروم | ایدج | افرکس | سافاری | آپرا |
|---|---|---|---|---|
| کروم | ای ای / ایدج | افرکس | سافاری | آپرا |
| 4.0 1.0 -webkit- |
9.0 | 4.0 3.6 -moz- |
4.1 3.0 -webkit- |
10.5 10.0 -o- |
- پچھلے پار بیک گرونڈ ریپیٹ
- پائیدھی پار بلاک سائز
