منصة بياني التعليمية

قوائم مرتّبة — أمثلة Inline (بدون <style>)

كل مثال مستقل، سطرين فاصل بين الأمثلة.

مثال 1 — أرقام افتراضية

1. البند الأول
2. البند الثاني
3. البند الثالث

مثال 2 — type="A" (أحرف إنجليزية كبيرة)

1. عنصر
2. عنصر
3. عنصر

مثال 3 — type="a" (أحرف إنجليزية صغيرة)

1. عنصر
2. عنصر
3. عنصر

مثال 4 — type="I" (أرقام رومانية كبيرة)

1. عنصر
2. عنصر
3. عنصر

مثال 5 — type="i" (أرقام رومانية صغيرة)

1. عنصر
2. عنصر
3. عنصر

مثال 6 — start="5" (ابدأ من 5)

5. هذا الخامس
6. ثم السادس
7. ثم السابع

مثال 7 — reversed (ترقيم عكسي)

1. الأخير
2. قبل الأخير
3. قبل قبله

مثال 8 — value على <li> (رقم عنصر محدد)

10. هذا رقمه 10
11. 11
12. 12

مثال 9 — list-style-position: inside

1. الرقم داخل النص، شوف التفاف السطر الطويل للتجربة… هذا سطر طويل لتلاحظ الفرق.
2. مثال مختصر

مثال 10 — list-style-position: outside

1. الرقم خارج النص (الافتراضي)
2. تنسيق تقليدي

مثال 11 — ملاحظة عن ::marker

تلوين/تكبير رقم التعداد عبر ::marker لا يشتغل بالـ Inline مباشرة. البديل: نعتمد على النوع/المكان بالأعلى، أو نبني أرقام مخصصة يدويًا (الأمثلة القادمة).

مثال 12 — أرقام مخصصة يدويًا (Span)

1. 1. بادج رقمية يدويًا
2. 2. بدون استخدام ::before
3. 3. متوافق مع قيود القالب

مثال 13 — دوائر أرقام (Badge)

1. 1 نقطة أولى
2. 2 نقطة ثانية

مثال 14 — خطوات عمودية

1. 1 ابدأ
2. 2 منتصف العمل
3. 3 إتمام

مثال 15 — مستويات متداخلة (روماني ثم حروف)

1. قسم أول
   1. تفصيل أ
   2. تفصيل ب
2. قسم ثان
   1. تفصيل أ
   2. تفصيل ب

مثال 16 — فواصل منقطة

1. عنصر بفاصل
2. عنصر بفاصل
3. عنصر أخير بدون فاصل

مثال 17 — عمودان (قد يتجاهله بعض القوالب)

1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
8. 8
9. 9
10. 10
11. 11
12. 12

مثال 18 — تمرير أفقي

1. بطاقة 1 طويلة
2. بطاقة 2 طويلة
3. بطاقة 3 طويلة
4. بطاقة 4 طويلة