عناصر Html ol ul برای ایجاد استفاده می شود. نمونه هایی از یک ظاهر طراحی شده در لیست های CSS. لیست شماره گذاری شده با استفاده از پس زمینه

تنها تفاوت این است که این تگ به شدت برای شماره گذاری لیست ها ساخته شده است. نام تگ از مخفف انگلیسی "فهرست مرتب" - یک لیست شماره گذاری شده است.

نحو برچسب

1. مورد شماره 1
2. مورد شماره 2
3. مورد شماره 3
4. ...

جایی که ویژگی type="value" می تواند مقادیر زیر را بگیرد

• A - نشانگرها را به شکل حروف لاتین بزرگ (A، B، C..) تنظیم می کند.
• الف - نشانگرها را به شکل حروف لاتین کوچک (a، b، c..) تنظیم می کند.
• I - نشانگرها را به شکل اعداد رومی بزرگ (I، II، III، IV..) تنظیم می کند.
• i - نشانگرها را به شکل اعداد رومی کوچک (i، ii، iii، iv..) تنظیم می کند.
• 1 (پیش فرض) - نشانگرها را به شکل اعداد عربی (1، 2، 3..) تنظیم می کند.

ویژگی start="value" مقدار شروع (مقدار شروع) گزارش را مشخص می کند.

ویژگی reversed تعداد معکوس (در صورت لزوم) را مشخص می کند.

برچسب بزنید

نیاز به استفاده از تگ بسته شدن دارد

یک جفت تگ برای تشکیل عناصر لیست استفاده می شود

1. . بین تگ‌های باز و بسته، کلمات، عبارات، پاراگراف‌ها، تصاویر، تکه‌های کد و بسیاری موارد دیگر وجود دارد که محتوای لیست گلوله‌شده است.

   توجه داشته باشید

   در داخل لیست امکان تغییر حساب به حساب کاربری شما وجود دارد. برای این تگ یک ویژگی خاص value="" وجود دارد.

2. ، که مقداری عددی به آن اختصاص داده شده است. مثلا

   1. مورد شماره 1
   10. مورد شماره 2
   11. مورد شماره 3

   نمونه هایی با لیست های شماره گذاری شده در html (

   )

   مثال 1. لیست شماره گذاری شده html به شکل حروف لاتین

   مثال با حروف بزرگ

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   مثال کوچک

   1. مورد شماره 10
   2. مورد شماره 11
   3. مورد شماره 12

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   مثال 2. لیست html شماره گذاری شده با حروف رومی

   مثال با حروف بزرگ

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   مثال کوچک

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   مثال 3. لیست html شماره گذاری شده با موقعیت شروع متفاوت

   مثالی که قابلیت های ویژگی start را نشان می دهد که به شما امکان می دهد مقدار شروع شمارنده را تنظیم کنید.

   50. مورد شماره 1
   51. مورد شماره 2
   52. مورد شماره 3

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3

   مثال 4. تغییر تعداد در لیست های شماره دار html

   در زیر نمونه ای با قابلیت تغییر مقادیر شمارنده با استفاده از ویژگی value هنگام نمایش عناصر جدید در تگ ها آورده شده است.

3. .

   10. مورد شماره 1
   11. مورد شماره 2
   100. مورد شماره 3
   101. مورد شماره 4

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3
   4. مورد شماره 4

   مثال 5. لیست شماره دار برگشت پذیر در html

   در زیر نمونه ای از لیست شماره گذاری شده معکوس (شمارش به ترتیب معکوس) را مشاهده می کنید.

   10. مورد شماره 1
   11. مورد شماره 2
   12. مورد شماره 3
   13. مورد شماره 4

   در این صفحه به نظر می رسد:

   1. مورد شماره 1
   2. مورد شماره 2
   3. مورد شماره 3
   4. مورد شماره 4

   لیست های شماره گذاری شده مجموعه ای از عناصر با شماره سریال آنها هستند. نوع و نوع شماره گذاری به ویژگی های برچسب بستگی دارد

   ، که برای ایجاد لیست استفاده می شود. هر مورد در یک لیست شماره گذاری شده با یک برچسب مشخص می شود
   1. همانطور که در زیر نشان داده شده است.
      1. نکته اول
      2. نکته دوم
      3. بند سوم

      اگر هیچ ویژگی اضافی را مشخص نکردید و فقط یک برچسب بنویسید

      ، سپس لیست با اعداد عربی (1، 2، 3،...) به طور پیش فرض استفاده می شود، همانطور که در مثال 11.3 نشان داده شده است.

      مثال 11.3. یک لیست شماره دار ایجاد کنید

      کار با زمان

      1. ایجاد وقت شناسی (شما هرگز برای چیزی دیر نخواهید رسید)؛
      2. درمان وقت شناسی (شما هرگز به جایی عجله نخواهید کرد)؛
      3. تغییر در درک زمان و ساعت
      
      
      

      نتیجه این مثالدر شکل نشان داده شده است. 11.3.

      برنج. 11.3. نمای فهرست شماره گذاری شده

      توجه داشته باشید که لیست شماره گذاری شده نیز به صورت خودکار به بالا، پایین و سمت چپ متن اضافه می کند.

      مقادیر زیر می توانند به عنوان عناصر شماره گذاری عمل کنند:

      • اعداد عربی (1، 2، 3، ...);
      • حروف لاتین بزرگ (A، B، C، ...)؛
      • حروف کوچک لاتین (a، b، c، ...)؛
      • اعداد رومی بزرگ (I، II، III، ...)؛
      • اعداد رومی کوچک (i، ii، iii، ...).

      ویژگی type تگ برای نشان دادن نوع لیست شماره گذاری شده استفاده می شود.

      . مقادیر احتمالی آن در جدول آورده شده است. 11.2.
      Tab. 11.2. انواع فهرست شماره گذاری شده

      نوع لیست	کد HTML	مثال
      اعداد عربی		1. چبوراشکا 2. کروکودیل گنا 3. شاپوکلیاک
      حروف بزرگ الفبای لاتین		الف چبوراشکا ب. کروکودیل گنا سی شاپوکلیاک
      حروف کوچک الفبای لاتین		آ. چبوراشکا ب کروکودیل گنا ج شاپوکلیاک
      اعداد رومی در حروف بزرگ		I. چبوراشکا II. کروکودیل گنا III. شاپوکلیاک
      اعداد رومی با حروف کوچک		من. چبوراشکا ii کروکودیل گنا III. شاپوکلیاک

      برای شروع لیست با یک مقدار خاص، از ویژگی start تگ استفاده کنید

      . فرقی نمی کند که کدام نوع لیست با type تنظیم شده باشد، ویژگی start برای هر دو اعداد رومی و عربی یکسان عمل می کند. مثال 11-4 نشان می دهد که چگونه می توان یک لیست با استفاده از اعداد رومی بزرگ که با هشت شروع می شود ایجاد کرد.

      مثال 11.4. شماره گذاری لیست

      8. شاه مگنوم XLIV
      9. شاه زیگفرید شانزدهم
      10. پادشاه زیگیزموند بیست و یکم
      11. شاه هوبرانت اول
      
      
      

      نتیجه این مثال در شکل نشان داده شده است. 11.4.

      

      برنج. 11.4. لیست شماره دار با اعداد رومی

      لیست های HTMLبرای گروه بندی اطلاعات مرتبط استفاده می شود. سه نوع لیست وجود دارد:

      لیست گلوله ای —

      - هر عنصر از لیست
      • با نشانگر مشخص شده است
        لیست شماره گذاری شده —
        - هر عنصر از لیست
        1. با یک عدد مشخص شده است
           فهرست تعاریف- - از جفت ترم تشکیل شده است
           —
           تعریف.

           هر لیست یک ظرف حاوی عناصر لیست یا جفت های تعریف اصطلاح است. عناصر لیست مانند عناصر بلوک عمل می کنند، که یکی زیر دیگری روی هم قرار گرفته اند و تمام عرض بلوک کانتینر را می گیرند. هر آیتم لیست دارای یک کادر اضافی در سمت خود است که بخشی از طرح نیست.

           ایجاد لیست های HTML

           1. لیست گلوله ای

           لیست گلوله اییک لیست نامرتب است (از فهرست نامرتب انگلیسی). با یک تگ جفت ایجاد شد

           . نشانگر آیتم لیست یک برچسب است، مانند یک دایره پر شده.

           مرورگرها به طور پیش فرض قالب بندی زیر را به کادر لیست اضافه می کنند:

           هر عنصر از لیست با استفاده از یک جفت تگ ایجاد می شود

        2. (از مورد فهرست انگلیسی).
        در دسترس .
        • مایکروسافت
        • گوگل
        • سیب
        برنج. 1. لیست گلوله ای

        2. لیست شماره گذاری شده

        لیست شماره گذاری شدهبا استفاده از تگ جفت ایجاد شده است. هر آیتم لیست نیز با یک عنصر ایجاد می شود

      • . مرورگر به طور خودکار عناصر را به ترتیب شماره گذاری می کند و اگر یک یا چند عنصر از چنین لیستی حذف شود، اعداد باقی مانده به طور خودکار دوباره محاسبه می شوند.

        بلوک لیست همچنین دارای سبک های پیش فرض مرورگر است:

      • ویژگی مقدار در دسترس است، که به شما امکان می دهد شماره پیش فرض را برای آیتم فهرست انتخاب شده تغییر دهید. به عنوان مثال، اگر اولین مورد در لیست تنظیم شده باشد
      • ، سپس بقیه شماره گذاری نسبت به مقدار جدید مجدداً محاسبه می شود.

        برای برچسب

        ویژگی های زیر در دسترس هستند:
        جدول 1. ویژگی های برچسب

        صفت	توضیحات، ارزش پذیرفته شده
        معکوس شد	ویژگی معکوس مشخص می کند که لیست به ترتیب معکوس نمایش داده شود (به عنوان مثال، 9، 8، 7 ...).
        شروع کنید	ویژگی start مقدار اولیه ای را که شماره گذاری از آن شروع می شود را تعیین می کند، به عنوان مثال ساخت و ساز اولین مورد به شماره سریال "10" اختصاص می یابد. همچنین می توانید نوع شماره گذاری را همزمان تنظیم کنید، به عنوان مثال، .
        نوع	ویژگی type نوع نشانگر مورد استفاده در لیست را مشخص می کند (به شکل حروف یا اعداد). مقادیر پذیرفته شده: 1 مقدار پیش فرض، شماره دهی است. الف - شماره گذاری لیست به ترتیب حروف بزرگ (الف، ب، ج، د). الف - شماره گذاری لیست به ترتیب حروف الفبا، حروف کوچک (a، b، c، d). I - شماره گذاری در اعداد بزرگ رومی (I، II، III، IV). i - شماره گذاری در اعداد کوچک رومی (i، ii، iii، iv).

        1. مایکروسافت
        2. گوگل
        3. سیب
        برنج. 2. لیست شماره گذاری شده

        3. فهرست تعاریف

        لیست های تعریفبا یک برچسب ایجاد شده است

        . از یک تگ برای افزودن یک اصطلاح استفاده می شود
        و برای درج یک تعریف، از تگ استفاده کنید
        .

        بلوک لیست تعریف دارای سبک های مرورگر پیش فرض زیر است:

        برای برچسب ها

        ,

        و

        در دسترس .

        تهیه کننده:

        پتر توچیلین

        قالب:

        آندری گایدولیان

        الکسی گاوریلوف

        ویتالی گوگونسکی

        ماریا کوژونیکوا

        
        برنج. 3. فهرست تعاریف

        4. لیست تودرتو

        اغلب امکانات لیست های ساده کافی نیست، به عنوان مثال، هنگام ایجاد فهرست مطالب، نمی توانید بدون اقلام تو در تو. نشانه گذاری برای یک لیست تودرتو این خواهد بود:

        • بند 1.
        • نقطه 2.
          • بند 2.1.
          • بند 2.2.
            • بند 2.2.1.
            • بند 2.2.2.
          • بند 2.3.
        • نکته 3.

        
        برنج. 4. لیست تودرتو

        5. فهرست شماره گذاری چند سطحی

        یک لیست چند سطحی برای نمایش موارد لیست در سطوح مختلف با تورفتگی های مختلف استفاده می شود. نشانه گذاری برای یک لیست شماره گذاری چند سطحی خواهد بود:

        1. پاراگراف
        2. پاراگراف
           1. پاراگراف
           2. پاراگراف
           3. پاراگراف
              1. پاراگراف
              2. پاراگراف
              3. پاراگراف
           4. پاراگراف
        3. پاراگراف
        4. پاراگراف

        این نشانه‌گذاری پیش‌فرض یک شماره‌گذاری جدید برای هر فهرست تودرتو ایجاد می‌کند که از یک شروع می‌شود. برای ایجاد شماره گذاری تو در تو، باید از ویژگی های زیر استفاده کنید:
        counter-reset یک یا چند شمارنده را بازنشانی می‌کند و مقداری برای تنظیم مجدد می‌دهد.
        counter-increment مقدار افزایش شمارنده را تنظیم می کند، یعنی. هر مورد بعدی با چه مرحله ای شماره گذاری می شود.
        محتوا - محتوای تولید شده، در این مورد مسئول نمایش یک عدد قبل از هر آیتم لیست است.

        Ol ( /* شماره گذاری استاندارد را حذف کنید */ list-style: هیچ؛ /* شمارنده را شناسایی کنید و نام آن را li کنید. مقدار شمارنده مشخص نشده است - به طور پیش فرض 0 است */ counter-reset: li; ) li:before ( /* عنصری را تعریف می کنیم که شماره گذاری می شود - li. شبه عنصر قبل نشان می دهد که محتوای درج شده با استفاده از ویژگی content قبل از آیتم های لیست قرار می گیرد. مقدار افزایش شمارنده نیز در اینجا تنظیم می شود (پیش فرض است 1) */ counter-increment: li؛ / * تعداد آیتم لیست با استفاده از ویژگی content counters() خروجی می شود به این معنی که متن تولید شده مقادیر همه شمارنده های با آن نام است. نقطه نقل شده یک جداکننده اضافه می کند. نقطه بین ارقام و نقطه با فاصله قبل از محتویات هر مورد لیست اضافه می شود */ content: counters(li,".") ". "; )
        برنج. 5. فهرست شماره گذاری چند سطحی

      شرح

      ویژگی های

      reversed: مشخص می کند که عناصر لیست به ترتیب نزولی (به جای ترتیب صعودی) باشند. مقادیر مشخصه بولی احتمالی:

      توجه: ویژگی معکوس فقط پشتیبانی می شود مرورگرهای کرومو سافاری

      شروع: مقدار عدد صحیح شروع را تنظیم می کند که از آن آیتم های موجود در لیست شماره گذاری می شوند. Example » type: نوع نشانگر مورد استفاده برای موارد لیست را مشخص می کند:

      • 1 - اعداد اعشاری (1, 2, 3, 4 ...).
      • آ- حروف لاتین به ترتیب حروف الفبا، به حروف بزرگ (A، B، C، D ...).
      • آ- حروف لاتین به ترتیب حروف الفبا، به حروف کوچک (a، b، c، d ...).
      • من- اعداد رومی با حروف بزرگ (I, II, III, IV ...).
      • من- اعداد رومی با حروف کوچک (i، ii، iii، iv ...).
      مثال "

      برچسب بزنید

      همچنین از ویژگی های جهانی و رویدادها پشتیبانی می کند

      سبک پیش فرض

      ol (نمایش: بلوک؛ نوع فهرست: اعشاری؛ حاشیه-بالا: 1em؛ حاشیه-پایین: 1em؛ حاشیه-چپ: 0؛ حاشیه-راست: 0؛ بالشتک-چپ: 40 پیکسل؛ )

      مثال

      1. قهوه
      2. چای
      3. شیر
      50. قهوه
      51. چای
      52. شیر
      تگ های HTML

      اهمیت و کاربرد

      یک لیست شماره گذاری شده (مرتب شده) برای عناصری است که به ترتیب خاصی دنبال می شوند. لیست شماره گذاری شده با برچسب شروع می شود

      (مخفف انگلیسی فهرست مرتبشده- فهرست مرتبشده). هر مورد لیست با یک برچسب شروع می شود
      1. (مورد لیست).

         پشتیبانی مرورگر

         صفت			اپرا		IExplorer	حاشیه، غیرمتمرکز
         شروع، تایپ	آره	آره	آره	آره	آره	آره
         معکوس شد	آره	آره	آره	آره	نه	نه

         ویژگی های

         صفت	معنی	شرح
         فشرده - جمع و جور	فشرده - جمع و جور	در HTML5 پشتیبانی نمی شود. مشخص می کند که لیست باید کوچکتر از اندازه معمولی باشد (ارتفاع خط: 80٪). به جای این ویژگی از CSS استفاده کنید.
         	معکوس شد	مشخص می کند که ترتیب در لیست شماره گذاری شده (ترتیب شده) باید نزولی باشد. ویژگی توسط مرورگرها پشتیبانی نمی شود اینترنت اکسپلوررو لبه
         شروع کنید	عدد	مقدار اولیه یک لیست مرتب شده (مرتب شده) را مشخص می کند. مقادیر باید اعداد صحیح باشند، مقادیر منفی مجاز هستند. هنگامی که با حروف استفاده می شود (نوع = "A" و نوع = "a")، عدد مشخص شده در مقدار مشخصه، شماره ترتیبی حرف در الفبا است. برای مثال، start = "4" با حرف مطابقت دارد "د"و لیست با او شروع خواهد شد. هنگام استفاده از مقدار start = "27"، شمارنده به صفر تنظیم می شود و لیست دو رقمی می شود ("27" = "AA"، "28" = "AB"، "29" = "AC". .).
         نوع	1 (پیش فرض) یک (بزرگ) یک (حروف کوچک) من (رومی بزرگ) من (کوچک رومی)	نوع نشانگری را مشخص می کند که در ساخت لیست مرتب شده (مرتب شده) استفاده می شود.

         مثال استفاده

         1. نکته اولنکته دوم
         2. بند سوم
         
         
         

         در صفحه به شکل زیر خواهد بود:

         1. نکته اول
         2. نکته دوم.
         3. نکته سوم.

         اگر می خواهید لیست با یک عدد خاص (نه 1) شروع شود، باید ویژگی start را برای تگ مشخص کنید.

         .

         مثلا:

         یکی دیگر از ویژگی های جالب نوع است که به شما امکان می دهد شماره گذاری الفبایی ("A" - بزرگ، "a" - حروف کوچک) یا شماره گذاری از اعداد رومی ("I" - بزرگ، "i" - حروف کوچک) را مشخص کنید.

         مثالی را در نظر بگیرید که تمام مقادیر ممکن ویژگی type (به غیر از مقدار پیش‌فرض) را ارائه می‌کند:

         >
         1. نکته اولنکته دوم
         2. بند سوم
         >
         1. نکته اولنکته دوم
         2. بند سوم
         >
         1. نکته اولنکته دوم
         2. بند سوم
         >
         1. نکته اولنکته دوم
         2. بند سوم
         
         
         

         توجه شما را به این نکته جلب می کنم که امکان تشکیل لیست های شماره دار (مرتب شده) تودرتو در سایر لیست های شماره دار (داخل عنصر لیست) وجود دارد.

         3. ):
            1. نکته اول
               1. نکته اولنکته دوم
               2. بند سوم
               نکته دوم
               3. بند سوم
               
               
               

               در صفحه به این صورت خواهد بود.