دستورالعمل مرجع CSS

کامپوٹر سی ای ای

background-position-y این ویژگی برای تنظیم موقعیت تصوير پس‌زمينه در محور y استفاده می‌شود.

توجه:به صورت پیش‌فرض، تصوير پس‌زمينه در گوشه بالا چپ عنصر قرار می‌گيرد و در جهت افقی و عمودی تکرار می‌شود.

كيف می‌توانيم تصوير پس‌زمينه را در محور y قرار دهيم؟

div {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-position-y: center;
}

کيف می‌توانيم تصوير پس‌زمينه را در بالا قرار دهيم؟

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: bottom;
}

چگونه از درصد در محور y برای قرارگیری تصویر پس‌زمینه استفاده کنید:

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: 50%;
}

چگونه از پیکسل در محور y برای قرارگیری تصویر پس‌زمینه استفاده کنید:

body {
  background-image: url('w3css.gif');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position-y: 80px;
}

background-position-y: value;

مقدار	توضیحات
top	پس‌زمینه را در بالا محور y قرار می‌دهد.
bottom	پس‌زمینه را در پایین محور y قرار می‌دهد.
center	پس‌زمینه را در مرکز محور y قرار می‌دهد.
y%	بالای محور y 0% و پایین محور y 100% است. نسبت‌های درصدی، ارتفاع محدوده‌ی قرارگیری پس‌زمینه را از ارتفاع تصویر پس‌زمینه کم می‌کند.
ypos	فاصله‌ای از بالا. یکای‌ها می‌تواند پیکسل (مثلاً 0px) یا دیگر باشد واحدهای CSS.
ypos offset	دو ارزشی زبان، تنها در افری کس و سافاری پشتیبانی می‌شود. ypos به top یا bottom تنظیم شود. offset این فاصله‌ای است که از بالای تصویر پس‌زمینه تا بالای یا پایین تصویر پس‌زمینه. یکای‌ها می‌تواند پیکسل (مثلاً 0px) یا دیگر باشد واحدهای CSS.
initial	این ویژگی را به مقدار پیش‌فرض خود تنظیم می‌کند. لطفاً مراجعه کنید: initial.
inherit	این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً مراجعه کنید: inherit.

مقدار پیش‌فرض:	0%
وراثت:	خیر
انیمیشن سازی:	پشتیبانی می‌شود. لطفاً مراجعه کنید:ویژگی‌های مرتبط با انیمیشن.
نسخه:	CSS3
JavaScript زبان:	object.style.backgroundPositionY="center"