جاري التحميل...

div في HTML

بعد block/inline، نستخدم صندوق div للتجميع دون إعلان landmark.

لماذا الصندوق بلا معنى مفيد

الصفحات تحتاج تجميعاً؛ البطاقة تبدأ غالباً بـ div وclass.

إجابة مباشرة

لفّ المحتوى المرتبط في div، وأضف class، وفضّل الوسوم الدلالية عند وضوح الدور.

مجموعة بطاقة واحدة

div يلف عنواناً وفقرة قصيرة.

Grouping with a card div

html

HTML Code

<div class="card">
<h2>Today</h2>
<p>Practice HTML containers with a simple card.</p>
</div>

قراءة مثال البطاقة

div صندوق تجميع
h2 وp يبقيان المعنى
class خطاف CSS

غلاف حول بطاقتين

غلاف خارجي يضم بطاقتين شقيقتين.

Wrapper with two cards

html

HTML Code

<div class="card-row">
<div class="card">
<h3>Lesson</h3>
<p>Read the notes once.</p>
</div>
<div class="card">
<h3>Practice</h3>
<p>Rebuild the markup from memory.</p>
</div>
</div>

قراءة مثال الغلاف

مستويان من div كافيان
الأطفال دلاليون

فضّل المعنى عند وجوده

div احتياطي وليس الخيار الأول لكل منطقة.

تمرين

بطاقة واحدة
بطاقتان في غلاف
احذف div الفارغ
اذكر ثلاثة وسوم لا تُستبدل بـ div

أخطاء شائعة

حساء div
div بدل p/ul/nav
أغلفة فارغة

ملخص

div حاوية عامة
class للخطاف
دلالي عند الوضوح
تجنّب الحساء

🧠 اختبر معرفتك

جاهز للبدء

اختبر معرفتك

تحدى نفسك مع هذا الاختبار التفاعلي واكتشف مدى فهمك للموضوع

❓

الأسئلة

🎯

70%

للنجاح

♾️

∞

الوقت

🔄

∞

المحاولات

📝 التعليمات

اقرأ كل سؤال بعناية
اختر أفضل إجابة لكل سؤال
يمكنك إعادة الاختبار عدة مرات كما تريد
سيتم عرض تقدمك في الأعلى

اللغة