آموزش CSS – خواص مقدماتی CSS – تنظیم پس زمینه Background

آموزش CSS – خواص مقدماتی CSS – تنظیم پس زمینه BackgroundReviewed by همیار پروژه on Sep 23Rating: 5.0تنظیم پس زمینه Backgroundآموزش CSS – خواص مقدماتی CSS – تنظیم پس زمینه Background

تنظیم پس زمینه Background

آموزش CSS – خواص مقدماتی CSS – تنظیم پس زمینه Background

خواص مقدماتی CSS – تنظیم پس زمینه Background

آموزش CSS – تنظیم پس زمینه Background در CSS

در جلسه چهارم از دوره آموزش CSS با معرفی خواص های مقدماتی CSS در خدمت شما عزیزان هستیم در این آموزش به معرفی عنصر Background در Css میپردازیم از این عنصر جهت تنظیم پس زمینه در صفحات وب استفاده میشود.

ویژگی Background برای تعریف افکت های پس زمینه برای یک عنصر به کار میرود.این ویژگی در طراحی وب سایت به شکیل تر شدن سایت شما کمک میکند.انواع مختلفی از این ویژگی وجود دارد که به شرح هر یک از آنها میپردازیم :

background-color
background-image
background-repeat
background-attachment
background-position

background-color : این خاصیت رنگ پس زمینه یک عنصر را مشخص میکند، برای مثال برای تنظیم رنگ پس زمینه بدنه سایت از کد زیر استفاده میکنیم :

background-image : با استفاده از این ویژگی تصویر پس زمینه یک عنصر را مشخص میکنیم ،برای مثال برای تنظیم تصویر پس زمینه بدنه سایت از کد زیر استفاده میکنیم :

پیشنهاد ویژه :   آموزش CSS - سی اس اس چیست

background-repeat : با استفاده از این ویژگی میتوانیم مشخص کنیم که تصویر چگونه تکرار شود.اگر میخواهیم تصویر ما به صورت افقی تکرار شود زمانی که خود تصویر نیز افقی است (برای جلوگیری از گذاشتن عکس سایز بزرگ که باعش کند شدن بالا آمدن سایت میشود و به هیچ عنوان در طراحی سایت پیشنهاد نمیشود ) :

زمانی که بخواهیم تصویر فقط یک بار و بدون تکرار نمایش داده شود از دستور زیر استفاده میکنیم :

background-attachment : برای اینکه بتوانیم تصویر پس زمینه را ثابت انتخاب کنیم از این ویژگی استفاده میکنیم. مقدار پیش فرض آن scroll میباشد.

background-position : این خاصیت موقعیت یک عنصر را مشخص میکند، برای مثال برای تنظیم موقعیت تصویر به گوشه سمت راست – بالا از کد زیر استفاده میکنیم :

این سه خط را میتوان به صورت خلاصه تر نوشت :

منبع : www.w3schools.com

موفق باشید

همیار پروژه CSS

دیدگاه خود را بیان کنید

تخفیف ویژه
تخفیف پکیج