%45 تخفیف، با کد daneshjoo روی تمام آموزش ها، بمناسبت روز دانشجو
زمان باقی مانده (آخرین فرصت)
سبد (0)

تبلیغات

خصوصیت background-size

مثال (خصوصیت background-size)

مشخص کردن اندازه عکس پس زمینه:

div
{
background:url(img_flwr.gif);
background-size:80px 60px;
background-repeat:no-repeat;
}
خودتان امتحان کنید »

در انتهای این بیاموز، مثال های بیشتری را خواهید دید.


پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

تمام مرورگرهای اصلی، خصوصیت background-size را پشتیبانی می کنند.

توجه: مرورگر Internet Explorer 8 و نسخه های قبلی آن، خصوصیت background-size را پشتیبانی نمی کند.


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

با استفاده از خاصیت background-size می توانید اندازه تصویر پس زمینه را مشخص نمایید.

مقدار پیشفرض auto
ارث بری خیر
نسخه CSS3
JavaScript ساختار object.style.backgroundSize="60px 80px"

نحوه استفاده

background-size: length|percentage|cover|contain;
مقدارتوضیحاتنمایش دادن
length width و height عکس پس زمینه را تنظیم می کند. اولین مقدار width و دومی height است. اگر فقط یک مقدار تنظیم شود، دومی با مقدار "auto" تنظیم می شود. نمایش دادن »
percentage width و height عکس پس زمینه را بصورت درصدی از عنصر والدش تنظیم می کند. اولین مقدار width و دومی height است. اگر فقط یک مقدار تنظیم شود، دومی با مقدار "auto" تنظیم می شود. نمایش دادن »
cover اندازه عکس پس زمینه به قدری بزرگ می شود که تمام ناحیه content را بپوشاند. ممکن است مقداری از عکس پس زمینه داخل ناحیه content قرار نگیرد و قابل رویت نباشد. نمایش دادن »
contain اندازه عکس پس زمینه به قدری بزرگ می شود که در ناحیه content جا شود و در ضمن تمام آن قابل رویت باشد. نمایش دادن »

مثالs

مثال - خودتان امتحان کنید

بسط کامل عکس پس زمینه در ناحیه content
بسط دادن تصویر پس زمینه (کشیدن) بصورتی که ناحیه content را بصورت کامل بپوشاند.

نمایش دو کپی از عکس پس زمینه
بسط دادن تصویر پس زمینه بصورتی که دقیقاً 2 کپی از آن در جهت افقی وجود داشته باشد.


بیاموزهای مرتبط

CSS3 Background (بیاموز CSS3)

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی