خاصية اختصار Place Self
آخر تحديث: 2026-09-13
place-self خاصية اختصار Place Self
place-self هو اختصار لـ align-self و justify-self. يتحكم في محاذاة عنصر شبكة واحد داخل خليته. وعلى عكس place-items، يُضبط place-self على عنصر الشبكة الفردي ويتجاوز إعداد place-items على مستوى الحاوية، مما يلبي احتياجات محاذاة خاصة لعنصر واحد.
| الفئة | |
|---|---|
| القيمة الأولية | auto |
| موروث | لا |
| ينطبق على | |
| نوع الحركة | |
| إصدار CSS | CSS3 |
| الحالة | قياسي |
📝 التركيب
place-self: <align-self> <justify-self>?;
⚙️ القيم
| القيمة | النوع | الوصف |
|---|---|---|
<align-self> / <justify-self> | القيمة | اختصار محاذاة عنصر واحد |
▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفحات
| المتصفح | |||||
|---|---|---|---|---|---|
| place-self | ✓ v57 | ✓ v16 | ✓ v52 | ✓ v10.1 | ✓ v44 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
تلميح: يُوسّط place-self: center عنصر شبكة واحد داخل خليته، بغض النظر عن إعداد place-items للحاوية.
تلميح: ترث القيمة auto إعداد place-items للحاوية وهي السلوك الافتراضي.
❓ الأسئلة الشائعة
Qأيهما له أولوية أعلى، place-self أم place-items؟
Aلـ place-self الأولوية الأعلى. يُضبط place-items على الحاوية ويُعرّف المحاذاة الافتراضية لكل عنصر شبكة، بينما يُضبط place-self على عنصر واحد ويتجاوز ذلك الافتراضي لذلك العنصر فقط، لذا يظل بقية العناصر على سلوك الحاية. وهذه نفس القاعدة التي يتجاوز بها align-self و justify-self كل من align-items و justify-items.
Qهل يمكن لـ place-self تجاوز اتجاه واحد فقط؟
Aنعم. مع قيمة واحدة، يُطبَّق على كلا الاتجاهين: يوسّط place-self: center العنصر أفقياً ورأسياً. مع قيمتين، يتحكم الأولى في الاتجاه الرأسي (align-self) والثانية في الاتجاه الأفقي (justify-self)، لذا يعني place-self: start end المحاذاة للأعلى ولليمين. وتنطبق نفس قاعدة القيمة الواحدة/اثنتين المستخدمة في place-items، ويقبل الاختصار مجموعة الكلمات المفتاحية الكاملة لكل من align-self و justify-self. عند حذف القيمة الثانية، تأخذ تلقائياً القيمة الأولى.
Qماذا يعني place-self: auto؟
Aتعني auto «استخدم الإعدادات الافتراضية للحاوة»، أي ورث align-items و justify-items للحاوة، اللذين يشكلان معاً place-items الخاص بها. والقيمة الافتراضية لـ place-self هي auto، لذا تتبع العناصر محاذاة الحاوة عند عدم ضبط شيء. وبما أن place-self اختصار، فإن كتابة place-self: auto تُعيد ضبط كل من align-self و justify-self دفعة واحدة؛ استخدم الخصائص المفصلة إذا أردت إعادة ضبط محور واحد فقط. وكتابة place-self: auto صراحةً مكافئة لعدم ضبطه وتُستخدم غالباً لتجاوز نمط مشترك موروث.