القوائم Lists HTML

قوائم (Lists)HTML
تسمح قوائم (Lists) HTML لمطوري الويب بتجميع مجموعة من العناصر ذات الصلة في قوائم.

مثال
قائمة HTML غير مرتبة:

غرض
غرض
غرض
غرض

قائمة HTML مرتبة:

البند الأول
البند الثاني
البند الثالث
البند الرابع

قائمة غير مرتبة Unordered HTML List

تبدأ القائمة غير المرتبة بعلامة <ul>. يبدأ كل عنصر بالقائمة بعلامة <li>.
سيتم تمييز عناصر القائمة برموز نقطية (دوائر سوداء صغيرة) افتراضيًا:
مثال


  <!DOCTYPE html>
<html>
<body>
<ul>
   <li> قهوة </li>
       <li> الشاي </li>
       <li> الحليب </li>
 </ul>

</body>
</html>

ترتيب القائمة Ordered HTML List
تبدأ القائمة المرتبة بعلامة <ol>. يبدأ كل عنصر بالقائمة بعلامة <li>.
سيتم تمييز عناصر القائمة بالأرقام افتراضيًا:
مثال


  <!DOCTYPE html>
<html>
<body>
<ol> 
     <li> قهوة </li>
     <li> الشاي </li>
     <li> الحليب </li>
 </ol>
</body>
</html>

قوائم الوصف HTML Description Lists
يدعم HTML أيضًا قوائم الوصف.
قائمة الوصف هي قائمة بالمصطلحات ، مع وصف لكل مصطلح.
تحدد العلامة <dl> قائمة الوصف ، وتحدد العلامة <dt> المصطلح (الاسم) ، وتصف العلامة <dd> كل مصطلح:
مثال


  <!DOCTYPE html>
<html>
<body>
<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>

</body>
</html>

الدرس السابق الدرس التالي