HTML teglangan. HTML-dagi ro'yxatlar - markirovka qilingan ro'yxat - raqamlangan ro'yxat - ta'riflar ro'yxati - HTML-dagi ichki ro'yxatlar. Misol: Grafik belgilar

HTMLda amalga oshirilgan ro'yxat turlaridan biri markirovka qilingan ro'yxat. Aks holda, bunday turdagi ro'yxatlar nomersiz yoki tartibsiz deb ataladi. Familiya ko'pincha tegishli teg nomining rasmiy tarjimasi sifatida ishlatiladi

    , ularning yordami bilan HTML hujjatlarida ushbu turdagi ro'yxatlar tashkil qilinadi (UL - Unordered List, unordered list).

    Belgilangan roʻyxatda uning elementlarini ajratib koʻrsatish uchun roʻyxat belgilari deb ataladigan maxsus belgilar qoʻllaniladi (ular koʻpincha bullets deb ataladi, bu inglizcha bullet atamasining rasmiy talaffuzi). Ro'yxat belgilarining ko'rinishi brauzer tomonidan belgilanadi va ichki ro'yxatlarni yaratishda brauzerlar avtomatik ravishda turli joylashtirish darajalarida markerlarning ko'rinishini diversifikatsiya qiladi.

    Teglar
      Va

    Belgilangan ro'yxatni yaratish uchun siz konteyner tegidan foydalanishingiz kerak, uning ichida ro'yxatning barcha elementlari joylashgan. Roʻyxatni ochish va yopish teglari roʻyxatdan oldin va keyin qator uzilishini taʼminlaydi, shu bilan roʻyxatni hujjatning asosiy mazmunidan ajratib turadi, shuning uchun bu yerda paragraf teglaridan foydalanishning hojati yoʻq.


    .

    Har bir ro'yxat elementi teg bilan boshlanishi kerak

  • (LI - Ro'yxat elementi, ro'yxat elementi). teg
  • mos keladigan yopish yorlig'ini talab qilmaydi, garchi uning mavjudligi printsipial jihatdan taqiqlanmagan. Brauzerlar odatda hujjatni har safar ko'rsatganda ishga tushadi. yangi element yangi qatordan ro'yxat.

    Taqdim etilgan ma'lumotlar asosiy markirovka qilingan ro'yxatni yaratish uchun etarli. Belgilangan ro'yxat yordamida HTML-hujjatga misol keltiraylik, uning brauzer tomonidan ko'rsatilishi rasmda ko'rsatilgan. 2.1.

    Belgilangan ro'yxatga misol

    Burj belgilari:

    • Qo'y

    • Toros

    • Egizaklar

    • Bokira

    • Tarozilar

    • Chayon

    • Sagittarius

    • Uloq

    • Kova

    • Baliq

    Guruch. 2.1. Belgilangan ro'yxatning brauzer ekrani

    Ro'yxat elementlariga qo'shimcha ravishda teg bilan belgilanganligini unutmang

  • , boshqa HTML elementlari mavjud bo'lishi mumkin. Yuqoridagi misolda ushbu elementlardan biri oddiy matn bo'lib, u ro'yxat elementi emas, balki uning sarlavhasi vazifasini bajaradi.

    Eslatma

    HTML tilidagi ba'zi darsliklar ro'yxat sarlavhasini o'rnatish uchun konteyner tegidan foydalanish kerakligini ko'rsatadi (LH - Ro'yxat sarlavhasi, ro'yxat sarlavhasi). Bu teg hozircha hech qanday umumiy brauzerlar tomonidan tan olinmaydi va HTML spetsifikatsiyasining bir qismi emas. Shunday qilib, undan foydalanish hech qanday xatolikka olib kelmasa ham, ma'nosiz bo'ladi.

    Tegda

      ikkita parametr ko'rsatilishi mumkin: COMPACT va TYPE.

      COMPACT parametri qiymatsiz yoziladi va brauzerga buni ko'rsatish uchun ishlatiladi bu ro'yxat ixcham shaklda taqdim etilishi kerak. Misol uchun, shrift yoki ro'yxat satrlari orasidagi masofa va boshqalar qisqarishi mumkin.

      Eslatma

      Hozirgi vaqtda tegda COMPACT parametrining mavjudligi

        hech qanday tarzda etakchi brauzerlarda ro'yxatlarning ko'rinishiga ta'sir qilmaydi. Shuning uchun dastur bu parametr ma'nosiz, ayniqsa HTML 4.0 spetsifikatsiyasi tomonidan foydalanish tavsiya etilmagani uchun.

        TYPE parametri quyidagi qiymatlarni qabul qilishi mumkin: disk, doira va kvadrat. Ushbu parametr ro'yxat belgilarining ko'rinishini majburlash uchun ishlatiladi. Markerning aniq turi siz foydalanayotgan brauzerga bog'liq bo'ladi. Odatda displey variantlari quyidagilardan iborat:

        TYPE = disk - markerlar to'ldirilgan doiralar sifatida ko'rsatiladi; TYPE = doira - markerlar ochiq doiralar sifatida ko'rsatiladi; TYPE = kvadrat - markerlar to'ldirilgan kvadratlar sifatida ko'rsatiladi. Misol kiritish:

          .

          Standart qiymat TYPE = disk. Ichki oʻrnatilgan markerli roʻyxatlar uchun standart qiymat birinchi darajadagi disk, ikkinchi darajadagi doira, uchinchi va undan keyingi darajadagi kvadratdir. Aynan shu narsa amalga oshiriladi oxirgi versiyalari Netscape brauzerlari va Internet Explorer. E'tibor bering, boshqa brauzerlar markerlarni boshqacha ko'rsatishi mumkin. Masalan, in HTML spetsifikatsiyalari TYPE = kvadrat qiymati bilan ko'rsatilgan marker turi uchun 4.0, to'ldirilmagan kvadrat (kvadrat kontur) ko'rsatilgan.

          Xuddi shu qiymatlarga ega TYPE parametri alohida ro'yxat elementlari uchun markerlar turini belgilash uchun ishlatilishi mumkin. Buning uchun ro'yxat elementi tegida mos keladigan qiymatga ega TYPE parametrini ko'rsatishga ruxsat beriladi

        • .

          Misol kiritish:

        • .

          Eslatma

          Brauzerlar alohida ro'yxat elementi uchun o'q turi spetsifikatsiyasini boshqacha izohlaydi. Netscape brauzeri bu va undan keyingi barcha belgilar uchun markerning ko'rinishini markerning ko'rinishini keyingi qayta ta'rifiga duch kelgunga qadar o'zgartiradi. Internet-brauzer Explorer faqat ushbu element uchun markerning ko'rinishini o'zgartiradi.

          Grafik ro'yxat belgilari

          Grafik tasvirlardan jozibali, yaxshi mo'ljallangan HTML hujjatlarini yaratishda keng qo'llaniladigan ro'yxat belgilari sifatida foydalanishingiz mumkin. Aslida, bunday imkoniyat to'g'ridan-to'g'ri taqdim etilmaydi HTML tili, lekin biroz sun'iy ravishda amalga oshiriladi. Bu buni qilish tavsiya etilmaydi yoki tanqid qilinmaydi degani emas, faqat bu yerda hech qanday maxsus HTML tili konstruksiyalari ishlatilmaydi.

          Fikrni tushunish uchun siz HTML sahifalarida ro'yxatlarni amalga oshirish mexanizmini tushunishingiz kerak. Ro'yxat yorlig'i ekanligi ma'lum bo'ldi

            (Haqiqatan ham, quyida muhokama qilingan boshqa turdagi teglar ro'yxati kabi) bitta vazifani bajaradi - u brauzerga ushbu tegdan keyin joylashgan barcha ma'lumotlar ma'lum miqdorda o'ngga (cheklangan) ko'rsatilishi kerakligini aytadi. Teglar
          • , alohida ro'yxat elementlariga ishora qilib, chiqishni taqdim eting standart belgilar ro'yxat elementlari.

            Agar biz grafik markerlar bilan ro'yxat tuzishimiz kerak bo'lsa, biz teglarsiz umuman qila olamiz

          • . Ro'yxatning har bir elementi oldiga kerakli grafik tasvirni kiritish kifoya. Yechilishi kerak bo'lgan yagona muammo - bu ro'yxat elementlarini bir-biridan ajratish. Buning uchun paragraf teglaridan foydalanishingiz mumkin

            Yoki qatorni tasmani majburlash
            . Grafik markerlar bilan ro'yxatni amalga oshirishga misol, ularning ko'rinishi rasmda ko'rsatilgan. 2.2 quyida ko'rsatilgan:

            faqat bir marta uzatiladi. Kichik rasmning fayl o'lchamlari ham juda kichik.

            Eslatma

            Grafik o'qlar bilan ro'yxatlarni yaratish usullari 8-bobda navbat bilan ko'rib chiqiladi.


            Ro'yxatlarning asosiy qo'llanilishi:

            Raqamlangan - qat'iy belgilangan tartibda keladigan elementlarni ro'yxatga olish.

            Belgilangan - elementlarni tasodifiy tartibda ro'yxatga olish.

            Ko'p darajali - ma'lum elementlarning ma'lumotlarini ko'rsatish uchun.

            Ta'riflar ro'yxati - lug'atlarni formatlash uchun ishlatiladi.

            Raqamlangan ro'yxat html sahifasi

            Teglar raqamlangan ro'yxatlarni yaratish uchun ishlatiladi

            1. teg

                teg

              1. Odatiy bo'lib, ro'yxat elementlari 1, 2, 3 tartibda raqamlangan... TYPE atributidan foydalanib, raqamlash uslubini o'zgartirishingiz mumkin.

                Qiymat raqamlash A TURI A, B, C.. a a, b, c.. I I, II, III.. i i, ii, iii.. 1 1. 2. 3..

                Agar siz allaqachon qo'shsangiz mavjud ro'yxat yangi qiymatlar bo'lsa, brauzer uni avtomatik ravishda qayta hisoblab chiqadi.

                START VALUE atributlaridan foydalanib, ro‘yxatning raqamlash tartibini o‘zgartirishingiz mumkin.

                START - ro'yxatning 1 dan farqli boshlang'ich raqamini belgilash uchun ishlatiladi.

                VALUE - ro'yxatning istalgan elementiga ixtiyoriy raqam berish imkonini beradi.

                Misol:

                Belgilangan ro'yxat html sahifasi

                Teglar markirovka qilingan ro'yxatlarni yaratish uchun ishlatiladi

                  teg

                    Butun ro'yxatning boshi/oxiri belgilangan.

                    teg

                  • alohida ro'yxat elementining boshini/oxirini ko'rsating.

                    Odatiy bo'lib, ro'yxat elementlari qora doira bilan belgilanadi. TYPE atributi belgilash uslubini o'zgartirish uchun ishlatilishi mumkin.

                    Bitta ro'yxatda siz ro'yxat elementlari uchun turli belgilardan foydalanishingiz mumkin.

                    Misol:

                    Ko'p darajali ro'yxat html sahifasi

                    Ko'p darajali ro'yxatlarni yaratish uchun siz markirovka qilingan yoki raqamlangan ro'yxatlardan yoki ikkalasining kombinatsiyasidan foydalanishingiz mumkin. Ko'p darajali ro'yxat bir ro'yxatni boshqasining tanasiga joylashtirish orqali yaratiladi. Asosiy vazifa chalkashmaslikdir. Buning uchun men sizga alohida ro'yxatlar uchun turli xil chekinishlarni qilishni maslahat beraman.

                    Html sahifa ta'riflari ro'yxati

                    Ta'riflar ro'yxatini yaratish uchun uchta tegdan foydalaniladi:

                    - ro'yxatning boshi/oxiri.

                    - muayyan atamaning boshlanishi/oxiri.

                    - atamaning izohli maqolasining boshi/oxiri.

                    Teglar

                    Va
                    almashtirish shart emas. Bular. Siz bir nechta atamalarni bitta ta'rifga "bog'lashingiz" mumkin va aksincha.

                    Misol:

                    HTML kodi:


                    1 muddat

                    Xulosa 1 dan 1 gacha

                    Xulosa 2 dan 1 gacha

                    Brauzer ekrani:


                    1 atama Referat1 dan 1 tagacha Annotatsiya2 dan 1 gacha

                    Ushbu saytda ba'zi elementlarga ma'lum uslublar qo'llanilganligi sababli, ularning jadvaldagi ko'rinishi siz oladigan narsadan biroz farq qiladi.

                    HTML ro'yxatlari bog'liq bo'lgan ma'lumotlarni guruhlash uchun ishlatiladi. Ro'yxatlarning uch turi mavjud:

                    markirovka qilingan ro'yxat

                      - ro'yxatning har bir elementi
                    • marker bilan belgilangan,
                      raqamlangan ro'yxat
                        - ro'yxatning har bir elementi
                      1. raqam bilan belgilanadi
                        ta'riflar ro'yxati- - termin juftlaridan iborat
                        ta'rifi.

                        Har bir ro'yxat - bu ro'yxat elementlari yoki atama ta'rifi juftlari joylashgan konteyner. Ro'yxat elementlari bir-birining ostiga joylashtirilgan va konteyner blokining butun kengligini egallagan blok elementlari kabi ishlaydi. Har bir ro'yxat elementi yon tomonda joylashgan qo'shimcha blokga ega bo'lib, u joylashtirishda ishtirok etmaydi.

                        HTML ro'yxatlarini yaratish

                        1. Belgilangan ro'yxat

                        Belgilangan roʻyxat tartibsiz ro'yxatdir (inglizcha tartibsiz ro'yxatidan). Ulangan teg yordamida yaratilgan

                        . Ro'yxat elementining markeri yorliqdir, masalan, to'ldirilgan doira.

                        Brauzerlar sukut bo'yicha ro'yxat blokiga quyidagi formatni qo'shadi:

                        Har bir ro'yxat elementi juftlangan teg yordamida yaratiladi

                      2. (inglizcha ro'yxat elementidan).
                        mavjud.
                      • Microsoft
                      • Google
                      • olma
                      Guruch. 1. Belgilangan ro'yxat

                      2. Raqamlangan ro'yxat

                      Raqamlangan ro'yxat juftlangan teg yordamida yaratiladi. Har bir ro'yxat elementi element yordamida ham yaratiladi

                    • . Brauzer avtomatik ravishda elementlarni tartib bilan raqamlaydi va agar siz bunday ro'yxatning bir yoki bir nechta elementlarini o'chirsangiz, qolgan raqamlar avtomatik ravishda qayta hisoblab chiqiladi.

                      Ro'yxat blokida standart brauzer uslublari ham mavjud:

                    • Tanlangan roʻyxat elementi uchun standart raqamni oʻzgartirish imkonini beruvchi qiymat atributi mavjud. Masalan, ro'yxatdagi birinchi element uchun siz o'rnatgan bo'lsangiz
                    • , keyin qolgan raqamlash yangi qiymatga nisbatan qayta hisoblab chiqiladi.

                      Teg uchun

                        Quyidagi atributlar mavjud:

                        Jadval 1. Teg atributlari
                        Xususiyat Tavsif, qabul qilingan qiymat
                        teskari Reversed atributi roʻyxatning teskari tartibda koʻrsatilishiga olib keladi (masalan, 9, 8, 7...).
                        boshlash Start atributi raqamlash boshlanadigan boshlang'ich qiymatni belgilaydi, masalan, qurilish
                          birinchi elementga "10" seriya raqami beriladi. Siz bir vaqtning o'zida raqamlash turini ham belgilashingiz mumkin, masalan,
                            .
                        turi Type atributi ro'yxatda foydalanish uchun marker turini (harflar yoki raqamlar) belgilaydi. Qabul qilingan qiymatlar:
                        1 - standart qiymat, o'nli raqamlash.
                        A - ro'yxatni alifbo tartibida raqamlash; Bosh harflar(A B C D).
                        a — roʻyxatni alifbo tartibida raqamlash, kichik harflar (a, b, c, d).
                        I - rim bosh raqamlarida raqamlash (I, II, III, IV).
                        i — rim kichik harflarida raqamlash (i, ii, iii, iv).
                        1. Microsoft
                        2. Google
                        3. olma
                        Guruch. 2. Raqamlangan ro'yxat

                        3. Ta'riflar ro'yxati

                        Ta'riflar ro'yxati teg yordamida yaratiladi

                        . Atama qo'shish uchun tegdan foydalaning
                        , va ta'rifni kiritish uchun - teg
                        .

                        Ta'riflar ro'yxati blokida quyidagi standart brauzer uslublari mavjud:

                        Teglar uchun

                        ,
                        Va
                        mavjud.

                        Direktor:
                        Piter Tochilin
                        Rollarda:
                        Andrey Gaidulyan
                        Aleksey Gavrilov
                        Vitaliy Gogunskiy
                        Mariya Kozhevnikova
                        Guruch. 3. Ta'riflar ro'yxati

                        4. Ichki ro'yxat

                        Ko'pincha oddiy ro'yxatlarning imkoniyatlari etarli emas, masalan, tarkiblar jadvalini yaratishda, ularsiz qilishning iloji yo'q. joylashtirilgan elementlar. Ichki ro'yxat uchun belgi quyidagicha bo'ladi:

                        • 1-band.
                        • 2-band.
                          • 2.1 kichik bandi.
                          • 2.2-kichik band.
                            • 2.2.1 kichik bandi.
                            • 2.2.2-kichik band.
                          • 2.3-kichik band.
                        • 3-band.

                        Guruch. 4. Ichki ro'yxat

                        5. Ko'p darajali raqamlangan ro'yxat

                        Ko'p darajali ro'yxat turli darajadagi ro'yxat elementlarini turli xil chekinishlar bilan ko'rsatish uchun ishlatiladi. Ko'p darajali raqamlangan ro'yxat uchun belgi quyidagicha bo'ladi:

                        1. paragraf
                        2. paragraf
                          1. paragraf
                          2. paragraf
                          3. paragraf
                            1. paragraf
                            2. paragraf
                            3. paragraf
                          4. paragraf
                        3. paragraf
                        4. paragraf

                        Ushbu standart belgilash har bir joylashtirilgan ro'yxat uchun bittadan boshlab yangi raqamlashni yaratadi. Ichki raqamlashni yaratish uchun siz quyidagi xususiyatlardan foydalanishingiz kerak:
                        qayta o'rnatish qiymatini ko'rsatib, bir yoki bir nechta hisoblagichlarni qayta o'rnatish;
                        qarshi o'sish hisoblagich o'sish qiymatini belgilaydi, ya'ni. har bir keyingi element qanday bosqichlarda raqamlanadi;
                        kontent — yaratilgan tarkib, ichida Ushbu holatda ro'yxatning har bir elementi oldidagi raqamni ko'rsatish uchun javobgardir.

                        Ol ( /* standart raqamlashni olib tashlang */ list-style: none; /* Hisoblagichni aniqlang va unga li nomini bering. Hisoblagich qiymati ko'rsatilmagan - sukut bo'yicha u 0 */ counter-reset: li; ) li :before ( /* Biz raqamlanadigan elementni aniqlaymiz - li. Pred pseudo-element kontent xususiyatidan foydalangan holda kiritilgan tarkib ro'yxat elementlaridan oldin joylashtirilishini bildiradi. Bu erda biz hisoblagich o'sishi qiymatini ham o'rnatamiz (standart). 1). */ qarshi o'sish: li; / * Kontent xususiyati ro'yxat elementining sonini ko'rsatadi. counters() yaratilgan matn shu nomdagi barcha hisoblagichlarning qiymatlarini ifodalashini bildiradi. Qo'shtirnoq ichidagi nuqta raqamlar orasiga ajratuvchi nuqta qo'shadi va har bir ro'yxat elementining mazmunidan oldin bo'sh joy qo'shiladi */ content: counters(li,".") "."; )
                        Guruch. 5. Ko'p darajali raqamlangan ro'yxat

                    HTML uchta ro'yxatni qo'llab-quvvatlaydi turli xil turlari, ularning har biri o'z parametrlariga ega:

                      1. – har bir elementi tartib raqami (harf)ga ega bo‘lgan raqamlangan (raqamlar yoki harflar yordamida) ro‘yxat;
                        • - har bir elementi yonida marker qo'yilgan (seriya raqamini ko'rsatadigan raqamli yoki alifbo belgilaridan ko'ra) marker qo'yilgan (raqamsiz) ro'yxat;
                        • – taʼriflar roʻyxati atamalar va taʼriflarni oʻz ichiga olgan nom/qiymat juftliklaridan iborat.

                        Raqamlangan ro'yxatlar

                        Raqamlangan ro'yxatda brauzer avtomatik ravishda element raqamlarini ma'lum bir qiymatdan (odatda 1) boshlab tartib bilan kiritadi. Bu sizga raqamlashni buzmasdan ro'yxat elementlarini kiritish va o'chirish imkonini beradi, chunki qolgan raqamlar avtomatik ravishda qayta hisoblab chiqiladi.
                        Raqamlangan ro'yxatlar blok elementi yordamida tuziladi

                          (Inglizcha tartiblangan ro'yxat - raqamlangan ro'yxatdan). Konteyner yonida
                            har bir ro'yxat elementi uchun element joylashtiriladi
                          1. (inglizcha ro'yxat elementidan - ro'yxat elementi). Standart arab raqamlari bilan raqamlangan ro'yxatdir.
                            teg
                              quyidagi sintaksisga ega:

                              1. element 1
                              2. element 2
                              3. element 3

                              Raqamlangan ro'yxat elementlari quyidagi misolda ko'rsatilganidek, bir nechta ro'yxat elementlarini o'z ichiga olishi kerak:

                              Misol: raqamlangan ro'yxat

                              • O'zingiz sinab ko'ring"

                              Bosqichma-bosqich ko'rsatma

                              1. Kalitni oling
                              2. Kalitni qulfga soling
                              3. Kalitni ikki marta aylantiring
                              4. Kalitni qulfdan chiqarib oling
                              5. Eshikni ochish

                              Bosqichma-bosqich ko'rsatma

                              1. Kalitni oling
                              2. Kalitni qulfga soling
                              3. Kalitni ikki marta aylantiring
                              4. Kalitni qulfdan chiqarib oling
                              5. Eshikni ochish

                              Ba'zan mavjud HTML kodlarini ko'rib chiqishda siz argumentga duch kelasiz turi elementda

                                , bu raqamlash turini ko'rsatish uchun ishlatiladi (harflar, rim va Arab raqamlari va h.k.). Sintaksis:

                                  Bu erda: yozing - belgilar ro'yxati:

                                  • A - bosh lotin harflari (A, B, C...);
                                  • a - kichik lotin harflari (a, b, c...);
                                  • I - katta rim raqamlari (I, II, III...);
                                  • i - kichik rim raqamlari (i, ii, iii...);
                                  • 1 - arab raqamlari (1, 2, 3 ...) (sukut bo'yicha ishlatiladi).

                                  Agar ro'yxat 1 dan boshqa raqam bilan boshlanishini istasangiz, buni atribut yordamida belgilashingiz kerak boshlash teg

                                    .
                                    Quyidagi misol katta rim raqamlari va XLIX boshlang'ich qiymati bilan raqamlangan ro'yxatni ko'rsatadi:

                                    Raqamlashni atribut yordamida ham boshlash mumkin qiymat, bu elementga qo'shiladi

                                  1. quyida bayon qilinganidek:

                                  2. Bunday holda, ro'yxatning ketma-ket raqamlanishi to'xtatiladi va shu vaqtdan boshlab raqamlash yana boshlanadi, bu holda ettidan.

                                    Atributlardan foydalanish misoli qiymat teg

                                  3. , bu sizga berilgan ro'yxat elementining sonini o'zgartirish imkonini beradi:

                                    Ushbu misolda "Birinchi ro'yxat elementi" 1 raqami, "Ikkinchi ro'yxat bandi" 7 raqami va "Ro'yxatning uchinchi elementi" 8 raqami bo'ladi.

                                    CSS yordamida raqamlangan ro'yxatlarni formatlash

                                    Ro'yxat raqamlarini o'zgartirish uchun siz xususiyatdan foydalanishingiz kerak ro'yxat uslubi turi CSS uslublar jadvallari:

                                      Raqamlangan ro'yxat uslublari
                                      MisolMa'nosiTavsif
                                      a, b, cpastki alfaKichik harf
                                      A, B, Cyuqori alfaBosh harflar
                                      i, ii, iiipastki rimRim raqamlari kichik harflar bilan
                                      I, II, IIIyuqori romanRim raqamlari bosh harflar bilan

                                      Misol: CSS xususiyatini qo'llash ro'yxat uslubi turi

                                      Belgilangan ro'yxatlar

                                      Belgilangan ro'yxatlar mohiyatan raqamlangan ro'yxatlarga o'xshaydi, faqat ular elementlarning ketma-ket raqamlanishini o'z ichiga olmaydi. Belgilangan ro'yxatlar blok elementi yordamida tuziladi

                                        (inglizcha tartibsiz ro'yxatidan - raqamlanmagan ro'yxat). Har bir ro'yxat elementi, raqamlangan ro'yxatlardagi kabi, teg bilan boshlanadi
                                      • . Brauzer ro'yxatning har bir elementini cheklaydi va avtomatik ravishda markerlarni ko'rsatadi.
                                        teg
                                          quyidagi sintaksisga ega:

                                          • Birinchi nuqta
                                          • Ikkinchi nuqta
                                          • Uchinchi nuqta

                                          Quyidagi misolda, sukut bo'yicha, ro'yxatning har bir elementi oldiga to'ldirilgan doira shaklida kichik marker qo'shilganligini ko'rishingiz mumkin:

                                          Teg ichida

                                        • Faqat matnni joylashtirish shart emas, oqimli tarkibning har qanday elementini (havolalar, paragraflar, rasmlar va boshqalar) joylashtirish mumkin.

                                          Oʻrnatilgan roʻyxatlar

                                          Har qanday ro'yxat boshqasiga joylashtirilishi mumkin. Element ichida
                                        • Ichki ro'yxat yoki ikkinchi darajali ro'yxat yaratish joizdir. Roʻyxatni joylashtirish uchun element ichidagi yangi roʻyxatni tasvirlab bering
                                        • allaqachon mavjud ro'yxat. Bitta markirovka qilingan roʻyxatni boshqasiga joylashtirganingizda, brauzer ikkinchi darajali roʻyxat uchun markirovka uslubini avtomatik ravishda oʻzgartiradi. Har qanday ro'yxat boshqasiga joylashtirilishi mumkin. Quyidagi misol raqamlangan ro'yxatning ikkinchi elementiga joylashtirilgan markirovka qilingan ro'yxatning tuzilishini ko'rsatadi.

                                          Misol: Ichki ro'yxatlar

                                          • O'zingiz sinab ko'ring"
                                          • dushanba
                                            1. Pochta yuboring
                                            2. Muharrirga tashrif
                                              • Mavzu tanlash
                                              • Dekorativ dizayn
                                              • Yakuniy hisobot
                                            3. Kechqurun xabarlarni ko'rish
                                          • seshanba
                                            1. Jadvalni qayta ko'rib chiqish
                                            2. Rasmlarni yuborish
                                          • Chorshanba...

                                          • dushanba
                                            1. Pochta yuboring
                                            2. Muharrirga tashrif
                                              • Mavzu tanlash
                                              • Dekorativ dizayn
                                              • Yakuniy hisobot
                                            3. Kechqurun xabarlarni ko'rish
                                          • seshanba
                                            1. Jadvalni qayta ko'rib chiqish
                                            2. Rasmlarni yuborish
                                          • Chorshanba...

                                          Belgilangan ro'yxatlarni formatlash

                                          O'zgartirish uchun ko'rinish list marker xususiyatidan foydalanish kerak ro'yxat uslubi turi CSS uslublar jadvallari:

                                            Quyidagi misolda markirovka qilingan roʻyxatlarning turli uslublari koʻrsatilgan:

                                            Misol: Belgilar ro'yxati uslublari

                                            • O'zingiz sinab ko'ring"
                                            • Kofe
                                            • Kofe
                                            • Kofe
                                            • Kofe

                                            Disk:

                                            • Kofe
                                            • Sut

                                            Davra:

                                            • Kofe
                                            • Sut

                                            Kvadrat:

                                            • Kofe
                                            • Sut

                                            Yo'q:

                                            • Kofe
                                            • Sut

                                            Grafik belgilar.

                                            HTMLda grafik markerlar bilan ro'yxat yaratish mumkin. Ro'yxat markerlari standart doiralar yoki kvadratlar bo'lsa, bu boshqa narsa va ishlab chiquvchining o'zi sahifa dizayniga muvofiq markerni tanlaganida mutlaqo boshqa narsa. Ro'yxat elementlarini chiroyli qilish uchun ko'pincha kichik rasmlardan foydalaniladi.
                                            Oddiy markerni grafik bilan almashtirish uchun xususiyatni almashtiring ro'yxat uslubi turi mulk uchun ro'yxat uslubidagi tasvir va rasmning URL manzilini ko'rsating:

                                              Misol: Grafik belgilar

                                              • O'zingiz sinab ko'ring"

                                              Burj belgilari

                                              • Toros
                                              • Egizaklar

                                              Burj belgilari

                                              • Qo'y
                                              • Toros
                                              • Egizaklar

                                              Ta'riflar ro'yxati (ta'riflar)

                                              Ta'riflar ro'yxati, masalan, shaxsiy atamalar lug'atini yaratish uchun juda foydali. Har bir ta'rif ro'yxati elementi ikki qismdan iborat: atama va uning ta'rifi.
                                              Siz butun ro'yxatni elementga joylashtirasiz

                                              (Inglizcha ta'riflar ro'yxatidan - ta'riflar ro'yxati). U teglarni o'z ichiga oladi
                                              (inglizcha ta'rif atamasidan - belgilangan so'z, atama) va
                                              (inglizcha ta'rif tavsifidan - aniqlanayotgan atamaning tavsifi).
                                              Ta'riflar ro'yxati ko'pincha ilmiy, texnik va o'quv nashrlarida qo'llaniladi, ulardan lug'atlar, lug'atlar, ma'lumotnomalar va boshqalarni tuzishda foydalaniladi.

                                              Ta'riflar ro'yxatining umumiy tuzilishi quyidagicha:

                                              Birinchi muddat
                                              Birinchi atama tavsifi
                                              Ikkinchi muddat
                                              Ikkinchi atama tavsifi

                                              Quyidagi misol ulardan birini ko'rsatadi mumkin bo'lgan foydalanish ta'riflar ro'yxati:

                                              Misol: Ta'riflar ro'yxati

                                              • O'zingiz sinab ko'ring"

                                              World Wide Web - ingliz tilidan. World Wide Web (WWW) - bu Internetga ulangan turli xil kompyuterlarda joylashgan tegishli hujjatlarga kirishni ta'minlaydigan taqsimlangan tizim. Internet - axborotni uzatish uchun yagona almashish protokolidan foydalanadigan tarmoqlar to'plami. Veb-sayt - bu havolalar va yagona dizayn bilan o'zaro bog'langan alohida veb-sahifalar to'plami.

                                              World Wide Web
                                              - ingliz tilidan World Wide Web (WWW) - bu Internetga ulangan turli xil kompyuterlarda joylashgan tegishli hujjatlarga kirishni ta'minlaydigan taqsimlangan tizim.
                                              Internet
                                              — axborotni uzatish uchun yagona almashuv protokolidan foydalanadigan tarmoqlar majmui.
                                              Veb-sayt
                                              - havolalar va yagona dizayn bilan o'zaro bog'langan alohida veb-sahifalar to'plami.

                                              Odatiy bo'lib, atama matni brauzer oynasining chap chetiga bosiladi va atama tavsifi quyida joylashgan va o'ngga siljiydi.

                                              Raqamlangan ro'yxatlar seriya raqamlari ko'rsatilgan elementlar to'plamidir. Raqamlash turi va turi element parametrlariga bog'liq

                                                , bu ro'yxatni yaratish uchun ishlatiladi. Quyidagi qiymatlar raqamlash elementlari sifatida xizmat qilishi mumkin:

                                                • Arab raqamlari (1, 2, 3, ...);
                                                • O'ndan kichik raqamlar uchun bosh nol bilan arab raqamlari (01, 02, 03, ...,10);
                                                • bosh lotin harflari (A, B, C, ...);
                                                • kichik lotin harflari (a, b, c, ...);
                                                • katta rim raqamlari (I, II, III, ...);
                                                • kichik Rim raqamlari (i, ii, iii, ...);
                                                • arman raqamlash;
                                                • Gruziya raqamlash.

                                                Amaliy nuqtai nazardan, markirovka qilingan ro'yxatdagi narsalarni ko'rsatish tamoyillari raqamlangan ro'yxatga o'xshash tarzda qo'llanilishi mumkin. Ammo biz sanab o'tish bilan shug'ullanayotganimizni hisobga olsak, bundan keyin ham muhokama qilinadigan ba'zi xususiyatlar mavjud.

                                                Ro'yxatni raqamlash

                                                Ro'yxatni istalgan raqamdan boshlashga ruxsat beriladi; bu maqsadda elementning start atributidan foydalaniladi

                                                  yoki elementning qiymati
                                                1. . Qiymat har qanday musbat butun sondir. Ro'yxat sifatida lotin harflari ishlatilsa ham, raqamlashning qaysi turi o'rnatilganligi muhim emas. Agar ro'yxatda bir vaqtning o'zida boshlang'ich va qiymat atributlari qo'llanilsa, ikkinchisi ustunlikka ega bo'ladi va raqamlash 1-misolda ko'rsatilganidek, qiymat bilan ko'rsatilgan raqamdan ko'rsatiladi.

                                                  1-misol: Ro'yxat raqamlashni o'zgartirish

                                                  Ro'yxatlar

                                                  1. Ish joyingizga yaxshi g'amxo'rlik qilishingiz kerak.
                                                  2. Xonadagi yoritishni yorug'lik manbai operatorning yon tomonida yoki orqasida joylashgani uchun sozlang.
                                                  3. Tibbiy asoratlardan qochish uchun yumshoq o'rindiqli stulni tanlash tavsiya etiladi.

                                                  Ushbu misoldagi ro'yxatning birinchi elementi rim raqami IV bilan boshlanadi, chunki start="4" atributi ko'rsatilgan, keyin V raqami keladi va oxirgi element tartibdan chiqib, X raqami bilan belgilanadi (rasm). 1).

                                                  Guruch. 1. Ro'yxatdagi rim raqamlari

                                                  Raqamlarni yozish

                                                  Odatiy bo'lib, raqamlangan ro'yxat ma'lum bir ko'rinishga ega: birinchi navbatda raqam, keyin nuqta, shundan so'ng matn bo'sh joy bilan ajratilgan holda ko'rsatiladi. Yozishning ushbu shakli vizual va qulaydir, ammo ba'zi ishlab chiquvchilar ro'yxatlarni raqamlashni loyihalashning boshqa usulini ko'rishni afzal ko'rishadi. Ya'ni, nuqta o'rniga rasmda ko'rsatilganidek, yopish qavs mavjud. 2 yoki shunga o'xshash narsa.

                                                  Guruch. 2. Qavs bilan raqamlangan ro'yxat ko'rinishi

                                                  Uslublar kontent va teskari o'sish xususiyatlaridan foydalangan holda ro'yxat raqamlash turini o'zgartirishga imkon beradi. Birinchidan, ol selektori qarshi qayta o'rnatishga o'rnatilishi kerak : element , bu har bir yangi ro'yxatdagi raqamlash yangidan boshlanishi uchun kerak. Aks holda, raqamlash davom etadi va 1,2,3 o'rniga 5,6,7 ni ko'rasiz. Ob'ekt qiymati hisoblagich uchun noyob identifikator bo'lib, uni o'zimiz tanlaymiz. Keyin asl markerlarni list-style-type uslubi xususiyati orqali none qiymati bilan yashirishingiz kerak.

                                                  Kontent xususiyati odatda ::after va ::befor psevdoelementlar bilan birgalikda ishlaydi. Shunday qilib, qurilishdan oldin li:: ro'yxatning har bir elementi oldiga ba'zi tarkib qo'shilishi kerakligini aytadi (2-misol).

                                                  Misol 2. O'z raqamlashni yaratish

                                                  Li::oldin ( mazmuni: counter(element) ") "; /* Raqamlarga qavs qo'shing */ counter-increment: item; /* Hisoblagich nomini belgilang */ )

                                                  Qiymat hisoblagichi (elementi) bo'lgan kontent xususiyati raqamni ko'rsatadi; Ushbu misolda ko'rsatilganidek, qavs qo'shish orqali biz kerakli raqamlash turini olamiz. ro'yxat sonini bittaga oshirish uchun qarama-qarshi o'sish kerak. E'tibor bering, item deb nomlangan bir xil identifikator butun vaqt davomida ishlatiladi. Yakuniy kod 3-misolda ko'rsatilgan.

                                                  3-misol: Ro'yxat ko'rinishini o'zgartirish

                                                  Ro'yxatlar

                                                  1. Birinchidan
                                                  2. Ikkinchi
                                                  3. Uchinchi
                                                  4. To'rtinchi

                                                  Yuqoridagi usuldan foydalanib, istalgan turdagi raqamlangan ro'yxatni yaratishingiz mumkin, masalan, kvadrat qavs ichiga raqam qo'ying, bu holda uslublarda faqat bitta qator o'zgaradi.

                                                  Tarkib: "[" counter(element) "] ";

                                                  Rus harflari bilan ro'yxat

                                                  Lotin harflari bilan raqamlangan ro'yxat mavjud, ammo ro'yxat uchun rus harflari yo'q. Ular yuqoridagi texnikadan foydalangan holda sun'iy ravishda qo'shilishi mumkin. Raqamlash uslublar orqali amalga oshirilganligi sababli, ro'yxatning o'zi asl bo'lib qoladi, unga faqat tanlangan sinf qo'shiladi, keling, uni kiril deb ataymiz (4-misol).

                                                  4-misol: Ro'yxat yaratish uchun kod

                                                  1. Bir
                                                  2. Ikki
                                                  3. Uch

                                                  Harflarni qo'shish psevdo-elementdan oldingi :: va kontent xususiyati yordamida amalga oshiriladi. Har bir satr o'z harfiga ega bo'lishi kerakligi sababli, biz psevdo-sinf :nth-child(1) dan foydalanamiz, harf raqami qavs ichida yoziladi. Birinchi harf, tabiiyki, A, ikkinchisi B, uchinchisi C va hokazo. Bu butun to'plam li selektoriga quyidagicha qo'shiladi (5-misol).

                                                  5-misol: Pseudo-class:nth-childdan foydalanish

                                                  Kiril li:nth-child(1)::oldin ( mazmuni: "a)"; ) .cyrilic li:nth-child(2)::oldin ( mazmuni: "b)"; ) .cyrilic li:nth-child(3)::oldin ( mazmuni: "at)"; )

                                                  Bu misolda har bir harfdan keyin qavs olinadi, barcha harflar kichik. Siz o'zingizning ro'yxat raqamlash turini belgilashingiz mumkin, masalan, unda nuqta bilan bosh harflar, bir yoki ikkita qavs yoki faqat harflar bo'lishi mumkin. Standart raqamlashdan farqli o'laroq, biz bu erda xohlagan narsani qilishimiz mumkin. O'nta harfdan iborat ro'yxat deyarli barcha holatlar uchun etarli bo'lishi kerak, ammo agar bu to'satdan etarli bo'lmasa, hech bo'lmaganda rus alifbosining barcha harflarini kiritish uchun ro'yxatimizni kengaytirishga hech narsa to'sqinlik qilmaydi.

                                                  Nihoyat, biz harflarning hizalanishi va joylashishini sozlaymiz, ixtiyoriy ravishda shrift o'lchamini, rangini va boshqa parametrlarni belgilaymiz (6-misol).

                                                  Misol 6. Rus harflari bilan ro'yxat

                                                  Roʻyxat

                                                  1. Borsch
                                                  2. Pike kotletlari
                                                  3. Kulebyaka
                                                  4. Smetanadagi qo'ziqorinlar
                                                  5. Ikra bilan pancakes
                                                  6. kvas

                                                  Natija bu misol shaklda ko'rsatilgan. 3.