آموزش های حرفه ای
مای دیزاین به عنوان یکی از تولید کنندگان محتوای آموزشی در زمینه طراحی وب و گرافیک به صورت تصویری، با کیفیت و اختصاصی در خدمت شما کاربران عزیز می باشد!
نرم افزار آندروید
طراحی و ساخت نرم افزار آندروید خدمت جدیدی است که در مای دیزاین ارائه میشود. داشتن نرم افزار برای گوشی های هوشمند امری جدید و هیجان انگیز می باشد!
طراحی وب و گرافیک
یکی از خدمات ما طراحی سایت های ایستا و پویا با جدید ترین متد های روز دنیاست. ساخت قالب هایی سبک و در عین حال زیبا، با استفاده از وردپرس، تخصص ماست!
خاصیت background-size در سی اس اس ۳

خاصیت background-size در سی اس اس 3
سلام. امروز با یکی از ویژگی ها امکانات نسخه سوم سی اس اس اومدم خدمتتون. با کمک این خاصیت میتونید اندازه تصویر زمینه عنصر مورد نظرتون رو تعیین کنید. با من همراه باشید.
این قابلیت در نسخه های قبلی سی اس اس موجود نبود ولی در این نسخه شما میتوانید اندازه تصویر مورد نظرتون رو با توجه به عناصر مورد استفاده در صفحه تنظیم کنید. حالت کلی این کد به صورت زیر است و این تابع چهار مقدار میگیرد:

background-size:value;

۱- length: در این حالت اندازه ارتفاع و عرض عکس پس زمینه بر اساس واحدی مثل px تعیین می شود. اگر برای مثال مقدار ۱۰px را بنویسید طول و عرض تصویر رو برابر با ۱۰px قرار میدهد. اما شما میتوانید با ترکیب دو عدد مقدار طول و عرض رو به صورت جدا وارد نمایید. برای مثال

background-size:10px 20px

که مقدار اول روی طول و مقدار دوم روی عرض تصویر اعمال میشود.
۲- %: در این حالت اندازه ارتفاع و عرض عکس پس زمینه بر اساس درصد نسبت به اندازه واقعی عکس، تعیین خواهد شد. در این حالت نیز مانند حالت اول میتوان ۲ مقدار داده شود.

background-size:110%

۳- cover: در این حالت، عکس پس زمینه به اندازه محتویات درون عنصر کوچک خواهد شد، تا ارتفاع و عرض آن اندازه عنصر شود.

background-size:cover

۴- contain: در این حالت، عکس پس زمینه به اندازه محتویات درون عنصر بزرگ خواهد شد، تا ارتفاع و عرض آن اندازه عنصر شود.

background-size:contain

برای درک بهتر کد ها رو خیلی ساده تست کنید!

6 پاسخ به “خاصیت background-size در سی اس اس ۳”

  1. farzad می‌گه:

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

    .post_img_class {
    	background: url('images/cover.png')no-repeat center;
    	opacity: 0.8;
    	top: 10px;
    	right: 10px;
    	left: 10px;
    	width: 480px;
    	height: 600px;
    }

    لطفا یه کمکی بکنید .

  2. دانیال می‌گه:

    سلام میشه اموزش بدید که چجوری میشه تو هر ۲۴ ساعت یک پست زمینه روی وب قرار بگیره

    • علی همایونی می‌گه:

      سلام. منظورتون از پست زمینه چیه دانیال جان.

      • دانیال می‌گه:

        سلام.منظورم من اینه که مثلا ۴ تا عکس پشت زمینه داشته باشیم این ۴ تا عکس تو هر ۲۴ ساعت به طور خودکار عوض شه.یعنی امروز یه عکسی بکگراند سایت هست فردا یه عکس دیگه پس فردا یه عکس دیگه.
        با تشکر

      • علی همایونی می‌گه:

        با استفاده از چند خط کد PHP متشکل از یک شرط که میتونید بر اساس تاریخ روز تصاویر رو تغییر بدید.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

آخرین محصولات فروشگاه
برخی مطالب تصادفی مای دیزاین
تصویر زمینه September سال ۲۰۱۲
انتخاب رنگی خاصی از تصویر با فتوشاپ
آموزش گرد کردن گوشه تصاویر در فتوشاپ
طرح لایه باز گوشی آیفون ۵
اضافه کردن ناحیه ابزارک به قالب وردپرس
گرادینت یا طیف در سی اس اس