سمة الوضع النمطي

التعريف والاستخدام

الوضع تعيين أو العودة إلى نوع طريقة تحديد الموقع للعنصر (ثابت، مطلق، نسبي أو محدد).

انظر أيضًا:

دليل تعليم 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 في دعم prefix Webkit من إصدار 6.1.
initial يتم تعيين هذا الخصائص إلى قيمته الافتراضية. يرجى الرجوع إلى initial.
inherit ينقل هذا الخصائص من العنصر الأم. يرجى الرجوع إلى inherit.

تفاصيل التقنية

القيمة الافتراضية: static
القيمة المقدمة: الخطاب، الذي يوضح نوع الموقع للعنصر.
CSS إصدار: CSS2

دعم المتصفحات

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم