ویژگی Style position

تعریف و استفاده

تعیین مکان نوع روش تعیین مکان عناصر (ثابت، نسبی، مطلق یا ثابت).

لطفاً به:

آموزش CSS:تعیین مکان CSS

دستورالعمل CSS:ویژگی position

مثال

مثال 1

تغییر مکان‌گذاری <div> عنصر از مکان‌گذاری نسبی به مکان‌گذاری绝对 می‌کند:

document.getElementById("myDIV").style.position = "absolute";

آزمایش کنید

مثال 2

استفاده از انواع مختلف مکان‌گذاری:

function myFunction(x)  {
  var whichSelected = x.selectedIndex;
  var posVal = x.options[whichSelected].text;
  var elem = document.getElementById("myDiv");
  elem.style.position = posVal;
}

آزمایش کنید

مثال 3

بازگشت مکان <h2> عنصر:

alert(document.getElementById("myH2").style.position);

آزمایش کنید

نحوه نوشتن

بازگشت ویژگی position:

object.style.position

تنظیم ویژگی position:

object.style.position = "static|absolute|fixed|relative|sticky|initial|inherit"

مقدار ویژگی

مقدار توضیح
static عناصر بر اساس ترتیب ظاهر شدنشان در جریان مستند نمایش داده می‌شوند. پیش‌فرض.
absolute عنصر بر اساس اولین عنصر مکان‌گذاری شده (غیرثابت) خود مکان‌گذاری می‌شود.
fixed عنصر بر اساس پنجره مرورگر مکان‌گذاری می‌شود.
relative

عنصر بر اساس مکان عادی خود مکان‌گذاری می‌شود.

بنابراین "left:20" مکان چپ عنصر را 20 پیکسل افزایش می‌دهد.
sticky

عناصر بر اساس موقعیت اسکرول کاربر مکان‌گذاری می‌شوند.

عناصر چسبنده بر اساس موقعیت اسکرول در مکان‌گذاری نسبی و ثابت بین‌شان تغییر می‌کنند.

این یک مکان‌گذاری نسبی است، تا زمانی که در داخل视‌پورت به مکان حرکت داده شده - سپس آن در مکان مناسب «چسبیده» می‌شود (مانند position:fixed).

نکته:پشتیبانی از IE/Edge 15 یا نسخه‌های قدیمی‌تر وجود ندارد. Safari از نسخه 6.1 شروع به پشتیبانی از پیشوند Webkit کرده است.
initial این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. لطفاً به initial.
inherit این ویژگی را از عنصر والد خود ارث می‌برد. لطفاً به inherit.

جزئیات فنی

مقدار پیش‌فرض: static
مقدار بازگشتی: رشته، که نوع مکان عنصر را نشان می‌دهد.
CSS نسخه: CSS2

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

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی