<aside>: عنصر ASIDE
آخر تحديث: 2026-10-13
<aside>عنصر ASIDE
يمثل محتوى مرتبطًا بشكل جانبي بالمحتوى الرئيسي، مثل شريط جانبي أو ملاحظة أو اقتباس أو إعلان.
| الفئة | دلالي |
|---|---|
| نموذج المحتوى | محتوى تدفقي |
| العناصر الأم المسموحة | أي عنصر يقبل المحتوى التدفقي |
| وسم الإغلاق | نعم — يتطلب إغلاق </aside> وسم |
| الحالة | قياسي |
📝 البنية
<aside>محتوى جانبي</aside>▶ مثال
عدّل الكود أدناه وشاهد النتيجة المباشرة في الملعب:
🌐 دعم المتصفح
| المتصفح |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <aside> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| مدعوم في جميع المتصفحات الرئيسية | |||||
نصيحة： لا يلزم أن يكون aside على الجانب بصريًا؛ المهم هو علاقته الجانبية دلاليًا.
❓ الأسئلة الشائعة
Qما الفرق بين aside و div؟
A
<aside> دلالته واضح: «جزء مرتبط ارتباطًا غير مباشر بالمحتوى الرئيس» (شريط جانبي، مساحة إعلانية، شرح مصطلحات، توصيات ذات صلة)؛ بينما <div> بلا أي دلالة. المعيار: احذف هذا الجزء — هل يبقى المحتوى الرئيس مكتملًا؟ إن اكتمل فـ aside مناسب.Qأين يوضع aside: داخل article أم خارجه؟
Aكلاهما صحيح والمعنى مختلف: داخله هو «ملحق بتلك المقالة» (كإحالات في المتن وشرح المصطلحات)؛ وخارجه «ملحق بالصفحة كلها» (كشريط الموقع الجانبي). حدد المستوى بحسب انتماء المحتوى.
Qهل يناسب aside التنقل؟
Aقائمة التنقل الجانبية على مستوى الموقع أدى
<nav> أفضل. <aside> يناسب المحتوى غير التنقلي ذي الصلة الضعيفة بالمحتوى الرئيس: فهرس، سحابة وسوم، قراءات مقترحة — فهي «إضافات» لا «تنقل».🏷️ وسوم ذات صلة
💡 حالات ذات صلة
المزيد من الحالات قادمة قريبًا — ترقبوا.
📚 دروس ذات صلة
