خاصية اختصار Place Self

آخر تحديث: 2026-09-13

place-self خاصية اختصار Place Self

place-self هو اختصار لـ align-self و justify-self. يتحكم في محاذاة عنصر شبكة واحد داخل خليته. وعلى عكس place-items، يُضبط place-self على عنصر الشبكة الفردي ويتجاوز إعداد place-items على مستوى الحاوية، مما يلبي احتياجات محاذاة خاصة لعنصر واحد.

الفئة
القيمة الأوليةauto
موروثلا
ينطبق على
نوع الحركة
إصدار CSSCSS3
الحالةقياسي

📝 التركيب

place-self: <align-self> <justify-self>?;

⚙️ القيم

القيمةالنوعالوصف
<align-self> / <justify-self>القيمةاختصار محاذاة عنصر واحد

▶ مثال

عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:

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

المتصفح ChromeChrome EdgeEdge FirefoxFirefox SafariSafari OperaOpera
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 صراحةً مكافئة لعدم ضبطه وتُستخدم غالباً لتجاوز نمط مشترك موروث.

📚 دروس ذات صلة

Web-Tutorial.com

فريق Web-Tutorial التقني

منصة دروس برمجية يديرها عدة مطورين. كل درس يتم كتابته ومراجعته بواسطة مطورين متخصصين في المجال. نعمل على ضمان دقة وموثوقية المحتوى — إذا لاحظت أي مشكلة، فيرجى إخبارنا.

100%