English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
يحدد خاصية position CSS كيفية تحديد موقع العنصر.
الجدول أدناه يوضح استخدام هذه الخاصية وتاريخ إصداراتها، بالإضافة إلى لغة الجافاسكربت المستخدمة في استخدام هذه الخاصية.
| القيمة الافتراضية: | static |
|---|---|
| يُستخدم في: | جميع العناصر |
| الوراثة: | لا يوجد |
| يمكن تفعيل الرسوم المتحركة: | لايرجى الرجوع إلى خصائص الرسوم المتحركة。 |
| الإصدار： | CSS 2،3 |
| جملة JavaScript: | object.style.position="absolute" |
نصيحة:العناصر غير position من العناصر static تُسمى الموضع. يتم تحديد موضع العناصر في البيئة المركبة من خلال خاصية z-index.
جملة هذا الخاصية هي:
position: static | relative | absolute | fixed | sticky | initial | inherit
في المثال أدناه، يتم عرض كيفية استخدام خاصية position.
h1 {
position: absolute;
top: 100px;
left: 150px;
}اختبار لـ‹/›ملاحظة: بالنسبة للنوعين من وسائط الطباعة، يظهر هذا الصندوق على كل صفحة، ويكون ثابتًا بالنسبة للصندوق الصفحة، حتى لو كانت الصفحة مرئية من خلال واجهة مستخدم (مثل في حالة "معاينة الطباعة").
يصف الجدول أدناه قيم هذه الخاصية.
| القيمة | الوصف |
|---|---|
| static | يكون صندوق هذا العنصر صندوقًا طبيعيًا، ويتم ترتيبه وفقًا للسلوك الطبيعي. بالنسبة للصناديق الثابتة،top،right،bottom،left،وz-indexسيتم تجاهل الخاصية. هذا هو القيمة الافتراضية. |
| relative | يتم تحديد العنصر بالنسبة لموضعه الطبيعي (يُسمى موضعًا في التدفق الطبيعي). |
| absolute | يكون العنصر بالنسبة لأول أسلافه الذي ليس له وضع ثابت. |
| fixed | يكون هذا العنصر ثابتًا بالنسبة لمنظور الشاشة، ولا يتحرك أثناء التدوير. عند الطباعة، سيتم طباعة العنصر على كل صفحة. |
| sticky | يكون موقع هذا العنصر مثل الصندوق الموضع بشكل نسبي، ويتم "اللصق" إلى أقرب أسلافه الذي يحتوي على "آلية التدوير". |
| initial | وضع هذا الخاصية إلى قيمته الافتراضية. |
| inherit | إذا تم تحديد، فإن العناصر ذات الصلة تأخذ قيمة الخاصية position من العنصر الأم. |
مستوى التطابق للمتصفحات الخاصة بخصائص position، الأرقام في الجدول التالي تمثل أحدث إصدار من المتصفح يدعم الخاصية؛ جميع المتصفحات الشائعة يدعمون الخاصية.
|