العنصر <li>
يستعمل العنصر <li>
لتمثيل عنصر في قائمة، ويجب أن يحتوى هذا العنصر في عنصر أب الذي يكون قائمة مرتبة <ol>
أو قائمة غير مرتبة <ul>
أو قائمة <menu>
.
تُعرَض عناصر القوائم العادية <menu>
والقوائم غير المرتبة وقبلها نقطة (bullet point)، أما في القوائم المرتبة فتعرض عناصرها بترتيبٍ تصاعدي وقبلها رقم أو حرف يدل على ترتيبها.
مثال عن قائمة مرتبة <ol>
عادية فيها ثلاثة عناصر:
<ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
مثال عن قائمة مرتبة <ol>
يبدأ الترقيم فيها من الرقم 3، وسيُعرَض الترتيب بالأرقام الرومانية ذات الحالة الكبيرة:
<ol type="I">
<li value="3">العنصر الثالث</li>
<li>العنصر الرابع</li>
<li>العنصر الخامس</li>
</ol>
قائمة غير مرتبة <ul>
فيها ثلاثة عناصر:
<ul>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ul>
لأمثلة أكثر تعقيدًا عن القوائم فانظر صفحة العنصر <ul>
و <ol>
.
بطاقة العنصر
تصنيفات المحتوى | لا يوجد. |
---|---|
المحتوى المسموح | محتوى تنظيمي. |
الوسم المختصر | يمكن حذف وسم النهاية إذا أتى بعد العنصر عنصر <li> آخر، أو لم يعد هنالك محتوى إضافي في العنصر الأب.
|
واجهة DOM | HTMLLIElement
|
دعم المتصفحات
Chrome | Firefox | Edge | Safari | Opera |
---|---|---|---|---|
مدعوم | مدعوم | مدعوم | مدعوم | مدعوم |
الخاصيات
يمكن استخدام الخاصيات العامة في هذا العنصر.
value
قيمة هذه الخاصية يجب أن تكون رقمًا صحيحًا الذي يُشير إلى ترتيب عنصر القائمة إذا كان ضمن قائمة مرتبة <ol>
، لا يُسمَح إلا بالقيم العددية لهذه الخاصية حتى لو كانت القائمة مرتبة باستخدام الأحرف أو الأرقام الرومانية، والعناصر التي تلي العنصر الذي تُستعمَل تلك الخاصية عليه ستتابع الترقيم من القيمة المحددة في هذه الخاصية.
لن يكون لهذه الخاصية أي معنى إذا استعملت في القوائم غير المرتبة (مثل <ul>
أو <menu>
).
يجدر بالذكر أنَّ هذه الخاصية كانت مهملة في HTML 4، لكن أعيد استخدامها في HTML5.
type
تُحدِّد هذه الخاصية نوع الترقيم:
a
: الأحرف اللاتينية بالحالة الصغيرةA
: الأحرف اللاتينية بالحالة الكبيرةi
: الأرقام الرومانية بالحالة الصغيرةI
: الأرقام الرومانية بالحالة الكبيرة1
: الأرقام العادية
ضبط هذه الخاصية سيؤدي إلى تجاهل القيمة المضبوطة في عنصر <ol>
إن وجدت.
لاحظ أنَّ هذه الخاصية أصبحت مهملة، ويجدر بك استخدام خاصية list-style-type
في CSS بدلًا منها، لكن ذكرناها هنا لتعلم بوجودها.
التنسيق الافتراضي
أغلبية المتصفحات تعرض العنصر <li>
مع ضبط الخاصية display
إلى list-item
:
li {
display: list-item;
}
مصادر ومواصفات
- معيار HTML Living Standard.
- مواصفة HTML5.
- مواصفة HTML 4.01، أهملت هذه المواصفة الخاصية
type
.