ویژگی background در CSS بخش دوم | ویژگی background-position

ویژگی background در CSS بخش دوم را در این سری آموزشی سایت آموزی برای شما خوبان تدارک دیدیم.

در بخش اول این مجموعه آموزشی با دو ویژگی background-color و background-repeat در css آشنا شدید.

ویژگی background در CSS بخش دوم

ویژگی background در CSS بخش دوم | ویژگی background-position - سایت آموزی

ویژگی background در CSS بخش دوم | ویژگی background-position – سایت آموزی

در این بخش نیز شما عزیزان را با دو ویژگی دیگر در سری مقالات background در css آشنا می کنیم.

در بخش دوم این آموزش دو ویژگی background_position و background-attachment را مورد بررسی قرار می دهیم.

ویژگی background-position در css

ویژگی background_position برای موقعیت یا جهت دادن به تصویر پس زمینه به کار می رود.

این ویژگی 6 مقدار می گیرد که عبارتنداز:

  1. مقدار bottom
  2. مقدار center
  3. مقدار left
  4. مقدار right
  5. مقدار top
  6. مقدار inherit

1- مقدار bottom در ویژگی background_position :

مقدار bottom موقعیت قرارگیری تصویر پس زمینه را در پایین عنصر مورد نظر تعیین می کند.

2- مقدار center در ویژگی background-position :

مقدار center موقعیت قرارگیری تصویر پس زمینه را در مرکز یا وسط عنصر مورد نظر تعیین می کند.

3- مقدار left در ویژگی background_position :

مقدار left موقعیت قرارگیری تصویر پس زمینه را در سمت چپ عنصر مورد نظر تعیین می کند.

4- مقدار right در ویژگی background-position :

مقدار right موقعیت قرارگیری تصویر پس زمینه را در سمت راست عنصر مورد نظر تعیین می کند.

5- مقدار top  در ویژگی background_position :

مقدار top موقعیت قرارگیری تصویر پس زمینه را در بالای عنصر مورد نظر تعیین می کند.

5- مقدار inherit در ویژگی background-position :

مقدار inherit موقعیت قرارگیری تصویر پس زمینه را همانند عنصر والد پدری تعیین می کند.

یعنی والد پدری هر موقعیتی پس زمینه اش قرار گیرد با انتخاب inherit این خصوصیت از والد به فرزند به ارث می رسد.

ویژگی background-attachment در css

ویژگی background در CSS بخش دوم | ویژگی background-position – سایت آموزی – اختصاصی سایت آموزی