تخطَّ إلى المحتوى

<dl>

وسم قائمة التعريفات <dl>

وسم dl ينشئ قائمة أزواج «مصطلح وشرحه»: dt للمصطلح وdd لتعريفه — قواميس المصطلحات والبيانات الوصفية.

ثالث أنواع القوائم وأقلها شهرة وأكثرها أناقة لحالته: أزواج اسم/قيمة. dt (المصطلح) يتبعه dd (شرحه) — قاموس مصطلحات، أسئلة/أجوبة، مواصفات منتج (المعالج: كذا، الذاكرة: كذا).

مرونته لطيفة: عدة dd لمصطلح واحد (معانٍ متعددة)، أو عدة dt لتعريف واحد (مترادفات).

الصياغة

<dl>
  <dt>المصطلح</dt>
  <dd>شرح المصطلح.</dd>
</dl>

⚡ جرّب بنفسك

عدّل الكود واضغط «تحديث» لترى النتيجة فورًا — التجربة أفضل معلّم.

🎨 محرّر HTML/CSS
<dl>
  <dt style="font-weight:bold; color:#6d28d9">HTML</dt>
  <dd style="margin:0 0 12px">لغة هيكلة صفحات الويب.</dd>
  <dt style="font-weight:bold; color:#6d28d9">CSS</dt>
  <dd style="margin:0">لغة تنسيق الصفحات وتصميمها.</dd>
</dl>
النتيجة المباشرة:

أهم الخصائص

الخاصيةالوظيفة
لا خصائص مميزة — البنية dt/dd هي كل القصة

💡 نصائح عملية

  • بياناتك أزواج اسم/قيمة؟ dl أدق دلاليًّا من ul أو جدول بعمودين
  • تخطيط «اسم بجانب قيمة» يُبنى عليه أنيقًا بـ CSS Grid

⚠️ أخطاء شائعة

  • dd بلا dt قبله أو العكس — الأزواج ناقصة
  • استخدامه للإزاحة البصرية فقط (خدعة قديمة) — الإزاحة وظيفة CSS

وسوم ذات صلة

🎓 تريد فهم الصورة الكاملة خطوة بخطوة؟ ابدأ من مسار HTML الكامل بالعربي.

📚 للتعمق التقني الكامل بالإنجليزية: MDN Web Docs