Internet Windows Android
Kengaytirish

Html ichida o'rnatilgan ro'yxatlar. raqamlangan ro'yxat

HTMLda ikki xil ro'yxatlar mavjud: raqamlangan va raqamlanmagan. Ularning yaratilishi deyarli bir xil. Hatto teglar ham bir belgi bilan farqlanadi. Shuningdek, siz raqamlangan va markirovka qilinganlarni ham o'z ichiga oladigan yaratishingiz mumkin.

Ushbu ro'yxatlar siz xohlagan tarzda o'zgartirilishi mumkin. Hammasi sizning tasavvuringizga bog'liq. Birinchidan, biz Word muharriridagi kabi standart ro'yxatlarni ko'rib chiqamiz, so'ngra ularni tanib bo'lmaydigan darajada yaxshilaymiz va loyihalashtiramiz.

Raqamlangan ro'yxat HTML

Oddiy raqamlangan raqam quyidagi teglar yordamida yaratilishi mumkin:

  • Ro'yxatdagi birinchi element
  • Ro'yxatdagi ikkinchi element
  • Ro'yxatdagi uchinchi element
  • Oddiy ro'yxatlar shunday ko'rinadi

    Standartlarga ko'ra, ro'yxatning har bir elementi ochilish va yopish belgisi ichida bo'lishi kerak. Ammo agar siz yopilish belgisini qo'ymasangiz, natija aynan bir xil bo'ladi. Ishtirokchi juda aqlli. Ro'yxatni o'zgartirish paytida u ochilish teglarini tahlil qiladi. Agar u yangisini ko'rsa

  • , keyin avtomatik ravishda uning oldiga qo'yadi
  • .

    Shunday qilib, ro'yxatlar quyida ko'rsatilganidek tuzilishi mumkin.

    Ammo professionallar nuqtai nazaridan, bu noto'g'ri.

    Tartibsiz (yoki markirovka qilingan) roʻyxatlar aynan shu tarzda tuziladi, lekin ol tegi oʻrniga ul yoziladi.

    Unda raqamlar yoki harflar yo'q - faqat markerlar deb ataladigan turli xil belgilar.

    HTML ko'p darajali raqamlangan ro'yxat

    Ko'pgina foydalanuvchilar ushbu imkoniyatga qiziqishmoqda. Shu sababli, har qanday raqamlangan HTML ro'yxatini ko'p darajali qilish mumkinligini ta'kidlash kerak. Qo'shimcha darajalar bir xil yoki belgilangan bo'lishi mumkin.

    Yuqoridagi misolda ko'rsatilgan ro'yxatni yaratish uchun siz quyidagilarni yozishingiz kerak.

    E'tibor bering, ushbu kodda, birinchi misollardan farqli o'laroq, type atributi qo'shilgan. Uning yordamida siz raqamlangan va markirovka qilingan ro'yxatlar uchun saralash turini belgilashingiz mumkin.

    Raqamlanganlar uchun biz alifbo yoki raqamlar turini, boshqa holatlar uchun esa marker turini ko'rsatamiz.

    Agar siz maxsus HTML tegidan foydalansangiz, raqamlangan ro'yxat siz xohlagan narsa bo'lishi mumkin.

    Jadvaldagi istalgan qiymat bilan type atributini belgilashingiz mumkin. Yoki CSS uslubi sinfida ro'yxat uslubi turini kerakli tartiblash turi bilan belgilang.

    Qadriyatlarni tarjima qilish juda oddiy. Ingliz tilini etarli darajada bilish. Ammo "doira", "kvadrat" va hokazo so'zlarni tarjima qila olmasangiz ham, ushbu qiymatlarni type atributida ko'rsatganingizda natija qanday bo'lishini vizual tarzda tushunishingiz mumkin.

    Raqamlangan ro'yxatlar uchun quyidagi variantlardan foydalaning:

    • 1 - arab raqamlari;
    • A - bosh harflar;
    • a - kichik lotin harflari;
    • I - bosh rim raqamlari;
    • i - kichik rim raqamlari.

    Sukut bo'yicha har doim ro'yxat bo'ladi, ya'ni hech narsa belgilamasangiz, bu type="1" ga teng.

    Bundan tashqari, raqamlangan ro'yxatlar istalgan joydan boshlanishi mumkin. Odatiy bo'lib, chiqish 1 dan. Lekin agar xohlasangiz, kamida yuzdan boshlashingiz mumkin. Buning uchun har qanday qiymat bilan start atributini ko'rsatish kerak.

    Bundan tashqari, xulosa teskari tartibda tuzilishi mumkin. Buning uchun siz teskari yozishingiz kerak.

    Ro'yxat dizayni

    Raqamlangan HTML ro'yxati shu qadar chiroyli tarzda yaratilishi mumkinki, siz bu oddiy ro'yxat ekanligini va Photoshop-da yaratilgan rasm emasligini darhol anglamasligingiz mumkin.

    Bu erda chiroyli ro'yxatlarga misollar.

    Misoldan ko'rinib turibdiki, raqamlashning ko'rinishini va elementlarning o'zini o'zgartirishingiz mumkin.

    Siz shunday muntazam ro'yxat yaratishingiz mumkin.

    CSS uslublarida siz ol teglari uchun dizaynni belgilashingiz kerak. Shuni esda tutingki, bu holda sozlamalar ushbu uslub fayli ishlatiladigan butun saytning barcha ro'yxatlariga qo'llaniladi.

    Avval dumaloq ro'yxat dizayni bilan variantni ko'rib chiqing. Ro'yxat kodiga qayting. Yaxlitlangan ro'yxat sinfi u erda ko'rsatilgan. Bunday go'zallikni yaratish uchun siz ushbu sinf bilan shug'ullanishingiz kerak. Siz sinfni xohlaganingizcha nomlashingiz mumkin.

    Endi kvadrat dizaynini ko'rib chiqing.

    Uslublar juda o'xshash. Farqi shundaki, birinchi holatda element CSS imkoniyatlaridan foydalangan holda yaxlitlanadi.

    Professional maket dizayneri barcha foydalanuvchilar zamonaviy kompyuterlardan foydalanmasligini oldindan bilishi va tushunishi kerak. Hamma ham Windows 7, 8, 10 o'rnatilmagan.Foydalanuvchilarning foizi hali ham Windows XP da va Internet Explorer brauzerining eski versiyalaridan foydalanadi.

    Qoida tariqasida, elementlarning deyarli barcha zamonaviy dizayn yaxshilanishlari ular tomonidan qo'llab-quvvatlanmaydi. Foydalanuvchiga sayt dizayni ustida umuman ishlanmagandek tuyuladi. Hammasi ketganini. Elementlar bir-biri bilan to'qnashadi. Bunga yo'l qo'ymaslik uchun barcha variantlarni hisoblashingiz kerak.

    Ba'zi veb-ustalar ularga ko'z yumadi, chunki bugungi bozorda ularning bozor ulushi tobora kichrayib bormoqda. Ammo professional uchun har bir tashrifchi muhim ahamiyatga ega, ayniqsa u tijorat sayti bo'lsa.

    Hammaga mos keladigan narsani qiling yoki barcha brauzer variantlarini ko'rib chiqing.

    HTML tili ma'lumotlarni ro'yxatlar shaklida taqdim etish uchun maxsus teglar to'plamini taqdim etadi. Ro'yxatlar elektron va bosma hujjatlarda ma'lumotlarni taqdim etishning eng ko'p qo'llaniladigan shakllaridan biridir. Biz ro'yxatlarga deyarli har kuni duch kelamiz, bu do'konda qilishimiz kerak bo'lgan narsalar ro'yxati, sinfdagi talabalar yoki shunchaki bajarilishi kerak bo'lgan narsalar. Ro'yxat tuzilmalarini tashkil qilish qobiliyati ko'plab matn muharrirlarida mavjud, xususan, kuchli Microsoft Word matn protsessorida har xil turdagi ro'yxatlarni formatlash uchun qulay vositalar mavjud (Microsoft Word yordamida HTML ro'yxatlarini yaratish imkoniyatlari 8-bobda muhokama qilinadi). Ro'yxatlardan foydalanish juda qulay bo'lgan bir nechta holatlar mavjud:

    • O'qilishi mumkin bo'lgan ko'rinish berish uchun ma'lumotlar qismlarini yagona tuzilishga birlashtirish.
    • Murakkab bosqichma-bosqich jarayonlar tavsifi.
    • Mundarija uslubida ma'lumotlarni joylashtirish, uning paragraflari hujjatning tegishli bo'limlariga ishora qiladi.

    E'tibor bering, yuqoridagi elementlar ro'yxat tuzilmasi shaklida tuzilgan.

    HTML ro'yxatlarning quyidagi asosiy turlarini taqdim etadi: markirovka qilingan, raqamlangan va aniqlangan ro'yxat. Har xil turdagi ro'yxatlarni amalga oshirish uchun quyidagi teglar qo'llaniladi:

      ,
        ,
        , , . Hujjatga kiritilgan har xil turdagi ro'yxatlar yordamida turli xil xususiyatlarni amalga oshirish mumkin, ularning tavsifi ushbu bobning mavzusidir. Har xil turdagi qurilish ro'yxatlarining xususiyatlari, shuningdek, ichki ro'yxatlardan foydalanish ko'rib chiqiladi.

        markirovka qilingan ro'yxat

        HTMLda amalga oshirilgan ro'yxat turlaridan biri markirovka qilingan ro'yxatdir. Aks holda, bunday turdagi ro'yxatlar tartibsiz yoki deyiladi

        tartibsiz. 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 (ko'pincha bullets deb ataladi, bu inglizcha bullet atamasining rasmiy ovozidir). Ro'yxat belgilarining ko'rinishi brauzer tomonidan belgilanadi va ichki ro'yxatlarni yaratishda brauzerlar turli darajadagi joylashtirish belgilarining ko'rinishini avtomatik ravishda diversifikatsiya qiladi.

          Teglar

            Va<LI >

            Belgilangan ro'yxatni yaratish uchun siz ro'yxatning barcha elementlari joylashgan teg-konteynerdan foydalanishingiz kerak. 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 foydalanishga hojat yoʻq.


            .

            Har bir ro'yxat elementi teg bilan boshlanishi kerak

          • (LI - Ro'yxat elementi, ro'yxat elementi). teg
          • tegishli yopish yorlig'iga muhtoj emas, garchi uning mavjudligi printsipial jihatdan taqiqlanmagan. Hujjatni ko'rsatishda brauzerlar odatda ro'yxatning har bir yangi elementini yangi qatordan boshlaydi.

            Yuqoridagi ma'lumotlar elementar markirovka qilingan ro'yxatni tuzish uchun etarli. Bu erda markirovka qilingan ro'yxat yordamida HTML hujjatining misoli keltirilgan, brauzerning ko'rsatilishi rasmda ko'rsatilgan. 2.1.

            Belgilangan ro'yxatga misol

              Burj belgilari:

              • Qo'y

              • Toros

              • Egizaklar

              • Saraton

              • sher

              • 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 rolini o'ynaydi.

            Eslatma

            HTML tili bo'yicha ba'zi darsliklarda konteyner tegidan ro'yxat sarlavhasini o'rnatish uchun foydalanish kerakligi haqida ko'rsatma mavjud. (LH - Ro'yxat sarlavhasi, ro'yxat sarlavhasi). Bu teg hozircha umumiy brauzerlarning hech biri 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 berilgan ro'yxatni ixcham shaklda ko'rsatish kerakligini ko'rsatish uchun ishlatiladi. Masalan, shrift yoki ro'yxat satrlari orasidagi masofani qisqartirish mumkin va hokazo.

              Eslatma

              Hozirgi vaqtda tegda COMPACT parametrining mavjudligi

                etakchi brauzerlar tomonidan ro'yxatlarning ko'rinishiga ta'sir qilmaydi. Shuning uchun, ushbu parametrdan foydalanish ma'nosizdir, ayniqsa uni ishlatish HTML 4.0 spetsifikatsiyasi tomonidan tavsiya etilmaydi.

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

                TYPE = disk - markerlar to'ldirilgan doiralar sifatida ko'rsatiladi; TYPE = doira - markerlar to'ldirilmagan doiralar sifatida ko'rsatiladi; TYPE = kvadrat - markerlar to'ldirilgan kvadratlar sifatida ko'rsatiladi. Yozib olish misoli:

                  .

                  Standart qiymat TYPE = disk. Ichki markirovka qilingan ro'yxatlar uchun standart qiymat birinchi darajadagi disk, ikkinchi darajadagi doira va uchinchi darajadagi kvadratdir. Aynan shu narsa Netscape va Internet Explorer brauzerlarining so'nggi versiyalarida amalga oshiriladi. E'tibor bering, boshqa brauzerlar markerlarni boshqacha ko'rsatishi mumkin. Masalan, HTML 4.0 spetsifikatsiyasida TYPE = kvadrat kvadrat kontur sifatida ko'rsatilganda ko'rsatiladigan marker turi.

                  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

                • .

                  Yozib olish misoli:

                • .

                  Eslatma

                  Brauzerlar alohida ro'yxat elementi uchun marker turi ko'rsatkichini boshqacha talqin qiladilar. 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 Explorer faqat ushbu element uchun markerning ko'rinishini o'zgartiradi.

                  Grafik belgilar ro'yxati

                  Grafik tasvirlarni ro'yxat belgilari sifatida ishlatishingiz mumkin, ular jozibali, chiroyli dizaynlashtirilgan HTML hujjatlarini yaratishda keng qo'llaniladi. Aslida, bu imkoniyat HTML tili tomonidan to'g'ridan-to'g'ri ta'minlanmaydi, balki biroz sun'iy ravishda amalga oshiriladi. Bu buni qilish tavsiya etilmaydi yoki tanqid qilinmaydi degani emas, faqat bu yerda hech qanday maxsus HTML tili konstruksiyalaridan foydalanilmaydi.

                  Fikrni tushunish uchun HTML sahifalarida ro'yxatlar qanday amalga oshirilishini tushunishingiz kerak. Ro'yxat yorlig'i ekanligi ma'lum bo'ldi

                    (shuningdek, quyida muhokama qilinadigan boshqa turdagi teglar ro'yxati) yagona vazifani bajaradi - bu brauzerga ushbu tegdan keyin joylashgan barcha ma'lumotlar o'ngga (chekindiga) bir oz miqdorda siljish bilan ko'rsatilishi kerakligini ko'rsatadi. teglar
                  • Alohida ro'yxat elementlariga ishora qilish standart ro'yxat elementi belgilarini beradi.

                    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. Bu holda hal qilinishi kerak bo'lgan yagona vazifa ro'yxat elementlarini bir-biridan ajratishdir. Buning uchun paragraf teglaridan foydalanishingiz mumkin.

                    Yoki majburiy chiziqni uzatish
                    . Grafik markerlar bilan ro'yxatni amalga oshirishga misol, ularning ko'rinishi rasmda ko'rsatilgan. 2.2 quyida ko'rsatilgan:

                    markirovka qilingan ro'yxat

                      Burj belgilari:

                        Qo'y

                        Toros

                        Egizaklar

                        Paket

                        Arslon

                        Bokira

                        Tarozilar

                        Chayon

                        Sagittarius

                        Uloq

                        Kova

                        Baliq

                    Guruch. 2.2. Grafik markerlar bilan markirovka qilingan ro'yxat

                    Berilgan misolda Green_ball.gif grafik fayli ro'yxat elementi markeri sifatida ishlatiladi. E'tibor bering, HTML-sahifalarda grafikadan foydalanish uzatiladigan ma'lumotlar hajmini sezilarli darajada oshirishi mumkin. Biroq, bu holda, bu o'sish juda kichik. Bu erda barcha markerlar uchun bir xil fayl ishlatiladi,

                    faqat bir marta uzatiladi. Kichik tasvirni o'z ichiga olgan fayl hajmi ham juda kichik.

                    Eslatma

                    Grafik markerlar bilan ro'yxatlar yaratish texnikasi 8-bobda navbat bilan ko'rib chiqiladi.

                    raqamlangan ro'yxat

                    HTMLda amalga oshirilgan ro'yxatning yana bir turi raqamlangan ro'yxatdir. Aks holda, ushbu turdagi ro'yxatlar tartibli deb ataladi. Familiya ko'pincha tegishli teg nomining rasmiy tarjimasi sifatida ishlatiladi.

                      , uning yordamida ushbu turdagi ro'yxatlar HTML hujjatlarida (OL - Ordered List, tartiblangan ro'yxat) tashkil etiladi.

                      Ushbu turdagi ro'yxatlar odatda alohida elementlarning tartiblangan ketma-ketligidir. Belgilangan ro'yxatlardan farqi shundaki, raqamlangan ro'yxatda har bir element avtomatik ravishda seriya raqamidan oldin bo'ladi. Raqamlash turi brauzerga bog'liq va ro'yxat teglari parametrlari bo'yicha o'rnatilishi mumkin. Aks holda, raqamlangan ro'yxatlarni amalga oshirish markirovka qilingan ro'yxatlarni amalga oshirishga o'xshaydi.

                      Teglar

                        Va
                      1. Raqamlangan ro'yxatni yaratish uchun siz konteyner tegidan foydalanishingiz kerak, uning ichida ro'yxatning barcha elementlari joylashgan. Ro'yxatning boshlanishi va tugash teglari ro'yxatdan oldin va keyin qator uzilishini ta'minlaydi, shu bilan ro'yxatni hujjatning asosiy mazmunidan ajratib turadi.

                        Belgilangan ro'yxatdagi kabi, markirovka qilingan ro'yxatdagi har bir element teg bilan boshlanishi kerak

                      2. .

                        Bu erda raqamlangan ro'yxat yordamida HTML hujjatining namunasi, kimning namoyishi brauzer rasmda ko'rsatilgan. 2.3.

                        Raqamlangan ro'yxatga misol

                          Erdan ko'rinadigan eng yorqin yulduzlar:

                          • Sirius

                          • K anopus

                          • Arktur

                          • Alpha Centauri

                          • Vega

                          • K apella

                          • Rigel

                          • Procyon

                          • Achernar

                          • Beta Kentavr

                          • Vetelgeuse

                          • Aldebaran


                            . . .

                          • Mizar


                            . . .

                          • Polar

                        Guruch. 2.Z. raqamlangan ro'yxat

                        Tegda

                          quyidagi parametrlarni belgilash mumkin: COMPACT, TYPE va START.

                          COMPACT parametri markirovka qilingan ro'yxatlar bilan bir xil ma'noga ega. TYPE parametri ro'yxat qanday raqamlanganligini aniqlash uchun ishlatiladi. U quyidagi qiymatlarni olishi mumkin:

                          TYPE = A - katta lotin harflari ko'rinishidagi markerlarni o'rnatadi;

                          TYPE = a - kichik lotin harflari ko'rinishidagi markerlarni o'rnatadi;

                          TYPE = I - katta rim raqamlari ko'rinishidagi markerlarni o'rnatadi;

                          TYPE = i - kichik rim raqamlari ko'rinishidagi markerlarni o'rnatadi;

                          TYPE = 1 - arab raqamlari ko'rinishidagi markerlarni o'rnatadi.

                          Odatiy bo'lib, TYPE = 1 qiymati har doim ishlatiladi, ya'ni arab raqamlari yordamida raqamlash. Bu ichki tartiblangan ro'yxatlarga ham tegishli. Bu yerda, markirovka qilingan roʻyxatlardan farqli oʻlaroq, brauzerlar sukut boʻyicha roʻyxatlarning har xil joylashtirish darajalarida har xil raqamlashni amalga oshirmaydi. E'tibor bering, ro'yxat elementining raqamidan keyin "nuqta" belgisi har doim qo'shimcha ravishda ko'rsatiladi.

                          Xuddi shu qiymatlarga ega TYPE parametri ro'yxatning alohida elementlarini qanday raqamlash kerakligini aniqlash uchun ishlatilishi mumkin. Buning uchun ro'yxat elementi tegida mos keladigan qiymatga ega TYPE parametrini ko'rsatishga ruxsat beriladi

                        1. .

                          Yozib olish misoli:

                        2. .

                          Tag START parametri

                            ro'yxatni bittadan emas, balki raqamlashni boshlash imkonini beradi. START parametrining qiymati ro‘yxat raqamlash turidan qat’iy nazar har doim natural son bo‘lishi kerak. Mana bir misol:

                              .

                              Bunday belgi ro'yxatning raqamlanishini lotin bosh harfi "E" dan belgilaydi. Boshqa raqamlash turlari uchun START=5 yozuvi mos ravishda “5” raqamidan, rim raqami “V” va hokazolardan boshlab raqamlashni o'rnatadi.

                              Ro'yxatning raqamlash turini va raqamlarning qiymatlarini o'zgartirish ro'yxatning istalgan elementi uchun ham amalga oshirilishi mumkin. teg

                            1. raqamlangan roʻyxatlar uchun TYPE va VALUE parametrlaridan foydalanishga ruxsat beradi. TYPE parametri teg bilan bir xil qiymatlarni olishi mumkin
                                .

                                P rekord misol:

                              1. .

                                Eslatma

                                Brauzerlar alohida ro'yxat elementi uchun raqamlash turi ko'rsatkichini turli yo'llar bilan izohlaydilar. Netscape brauzeri ushbu element va barcha keyingi elementlarning raqamlanishini keyingi bekor qilinmaguncha o'zgartiradi. Internet Explorer faqat ushbu element uchun raqam ko'rinishini o'zgartiradi.

                                Vtegning VALUE parametrining qiymati

                              2. - ro'yxatning berilgan elementi raqamini o'zgartirish imkonini beradi. Bu barcha keyingi elementlarning raqamlanishini o'zgartiradi. Oddiy foydalanish ba'zi elementlar o'tkazib yuborilgan ro'yxatlar uchundir. Bunday ro'yxatning misoli yuqorida keltirilgan (2.3-rasm). U eng yorqin yulduzlarning tartiblangan ro'yxatini beradi, ularda 58 va 75 joylarda bizning kengliklarda aniq ko'rinadigan yulduzlar joylashgan (Mizar - Katta yulduz turkumidagi eng yorqin yulduz va Shimoliy yulduz - Kichik Ursa).

                                Bu erda har xil turdagi raqamlashdan foydalanishning yana bir asl misoli. Quyidagi HTML kodi har xil raqamlangan uchta ro'yxatni belgilaydi. Ko'rish qulayligi uchun ro'yxatlarning har biri jadvalning alohida katakchasiga joylashtirilgan. Barcha uchta ro'yxat bir xil va faqat raqamlash turi bo'yicha farqlanadi: jadvalning birinchi ustunida - arab raqamlari, ikkinchisida - rim, uchinchisida raqamlash lotin harflarida. E'tibor bering, ro'yxatning elementlari bo'sh, ya'ni har qanday tegdan keyin

                              3. ma'lumotlar yo'q. Bunday misoldan arab va rim raqamlari o'rtasidagi yozishmalar jadvali sifatida foydalanish mumkin. Ma'lum bo'lishicha, ro'yxatlarni qo'llab-quvvatlaydigan har qanday brauzer taqdim etilgan HTML kodini terish orqali bunday jadvalni yaratish uchun ishlatilishi mumkin (2-4-rasm). Rim raqamlarida raqamlash 3999 qiymatigacha to'g'ri ishlaydi. O'ng ustunni ko'rib chiqish orqali siz lotin harflarida raqamlash qanday amalga oshirilishini tushunishingiz mumkin. Bir harfli raqamlash (A dan Z gacha) tugagandan so'ng, keyingi raqam sifatida birinchi ikki harfli raqam - AA va boshqalar olinadi.

                                Ro'yxatlarda har xil turdagi raqamlashdan foydalanish


                                  1. . . .


                                1. . . .


                                1. . . .

                                Guruch. 2.4. HTML ro'yxatini raqamlashning har xil turlari

                                Ta'riflar ro'yxati

                                Ta'riflar ro'yxati, shuningdek, atama ta'rifi lug'atlari deb ataladi, ro'yxatning maxsus turidir. Boshqa turdagi ro'yxatlardan farqli o'laroq, ta'riflar ro'yxatining har bir elementi doimo ikki qismdan iborat. Ro'yxat elementining birinchi qismida aniqlangan atama, ikkinchi qismida esa atamaning ma'nosini ochib beruvchi lug'at yozuvi ko'rinishidagi matn mavjud.

                                Ta'riflar ro'yxati konteyner tegi yordamida belgilanadi

                                (Ta'riflar ro'yxati). Konteyner yorlig'i ichida
                                (Tanriflash Term) belgilangan muddat belgilanadi, va teg
                                (Ta'rif tavsifi) - uning ta'rifi bilan paragraf. Teglar uchun
                                Va
                                tegishli so'nggi teglarni tashlab qo'yishingiz mumkin.

                                Umuman olganda, ta'riflar ro'yxati quyidagicha yozilgan:

                                Muddati

                                Terminning ta'rifi

                                Tegdan keyingi matnda

                                paragraf teglari kabi blok darajasidagi elementlardan foydalanish mumkin emas

                                yoki sarlavhalar

                                -

                                . Umumiy qoidaga ko'ra, belgilanayotgan atama matni bir qatorda bo'lishi kerak. Atama ta'rifini o'z ichiga olgan matn atama ta'rifidan so'ng keyingi satrdan (yoki ba'zi brauzerlar uchun satr bo'yicha) o'ng tomonda chekinish bilan ko'rsatiladi. Tegdan keyin joylashtirilgan ma'lumotlarda
                                , blok darajasidagi elementlarni joylashtirish mumkin. Bundan kelib chiqadiki, xususan, ta'riflar ro'yxatini joylashtirish mumkin.

                                Tegda

                                COMPACT parametri ko'rsatilishi mumkin, uning maqsadi yuqorida tavsiflangan boshqa ro'yxatlarga o'xshash.

                                Ta'riflar ro'yxatidan foydalanadigan HTML hujjatiga misol:

                                Ta'riflar ro'yxatiga misol

                                Odamning tipik temperamentlarini tasniflash,
                                asos solgan

                                Gippokratning qarashlari haqida

                                  Flegmatik odam

                                  Passiv, juda qobiliyatli, sekin moslashish;
                                  kayfiyat barqaror, tashqi ta'sirga kam sezgir;
                                  hissiy reaktsiyalarning letargiyasi va ixtiyoriy faoliyatdagi sekinlik

                                  sanguine

                                  Faol, baquvvat, moslashuvchan, -
                                  hissiy reaktsiyalarning jonliligi va harakatchanligi, irodaviy ko'rinishlarning tezligi va kuchi

                                  Xolerik

                                  Faol, juda baquvvat, qat'iyatli;
                                  impulsivlik va hissiy reaktsiyalarning kuchi, zo'ravon ixtiyoriy ko'rinishlar

                                  melankolik

                                  Passiv, charchash oson, moslashish qiyin -
                                  irodaviy ko'rinishlarning zaifligi va tushkun kayfiyatning ustunligi, o'ziga ishonchsizlik

                                Berilgan HTML hujjatning brauzerda ko'rinishi rasmda ko'rsatilgan. 2.5.

                                Guruch. 2.5. Ta'riflar ro'yxati (lug'atdagi yozuvlar guruhiga o'xshaydi)

                                Ro'yxatlarni yozing

                                Va

                                Ro'yxatlarni yozing

                                Va hozirda deyarli qo'llanilmaydi, garchi ularni etakchi brauzerlar tomonidan qo'llab-quvvatlansa ham. HTML 4.0 spetsifikatsiyasida ushbu ro'yxat turlarining ikkalasi ham eskirgan deb belgilangan. Buning o'rniga teg bilan belgilangan markirovka qilingan ro'yxatlardan foydalanish taklif etiladi
                                  .

                                  Dastlab, ushbu turdagi ro'yxatlar an'anaviy markirovka qilingan ro'yxatlarga qaraganda ancha ixchamroq bo'lgan. Ushbu ro'yxatlarning elementlarini yozish qoidalariga ko'ra, ularga blok elementlaridan foydalanishga ruxsat berilmagan, ya'ni bu turdagi ro'yxatlarni joylashtirishni amalga oshirish mumkin emas. Ro'yxatning har bir elementi bitta satr matn edi.

                                  kabi ro'yxatlar uchun

                                  ro'yxat elementi matnining uzunligi (24 belgi) bo'yicha cheklovni joriy etish rejalashtirilgan edi. Bunday cheklash imkon beradi

                                  ro'yxatlarni yozing

                                  /W tugmasidan foydalanganda UNIX va MS-DOS operatsion tizimlarida kataloglar ro'yxatiga o'xshash shaklda (bir nechta ustunlarda). Bundan tashqari, ushbu turdagi ro'yxat elementlari uchun o'qlar ko'rsatilmagan.

                                  Hozirgi vaqtda ushbu g'oyalarning barchasi amalga oshirilmadi, chunki ushbu turdagi ro'yxatlardan keyingi foydalanish tavsiya etilmaydi. Brauzerlarning zamonaviy versiyalari ushbu turdagi ro'yxatlarni xuddi shu turdagi ro'yxatlar bilan bir xil tarzda taqdim etadi

                                    .

                                    Oʻrnatilgan roʻyxatlar

                                    Ba'zida bir turdagi ro'yxat elementi bir xil yoki boshqa turdagi to'liq ro'yxatni o'z ichiga olishi kerak bo'ladi. Bu ko'p darajali yoki ichki ro'yxatlarni tashkil qiladi. HTML har xil turdagi ro'yxatlarni o'zboshimchalik bilan joylashtirish imkonini beradi, lekin ularni tashkil qilishda ehtiyot bo'lish kerak.

                                    Quyida ichki ro'yxatlari bo'lgan hujjatning HTML kodi keltirilgan, ularning ko'rinishi rasmda ko'rsatilgan. 2.6. Ushbu misolda markirovka qilingan ro'yxatning har bir elementi o'zining raqamlangan ro'yxatiga ega.

                                    Ichki ro'yxat misoli

                                      Ba'zi sayyoralarning sun'iy yo'ldoshlari

                                    • Zempa

                                        1. Oy

                                    • mapc

                                        1. Fobos

                                        2. Deimos

                                    • Uran

                                        1. Ariel

                                        2. Umbriel

                                        3. Titaniya

                                        4. Oberon

                                        5. Miranda

                                    • Neptun

                                        1. Triton

                                        2. Nereid

                                      Salom, aziz blog o'quvchilari. Bugun ushbu sarlavha ostida men buning uchun maxsus ishlab chiqilgan UL, OL, LI va DL teglari asosida yaratilishi mumkin bo'lgan turli Html ro'yxatlari haqida gapirmoqchiman. UL va LI juftligi yordamida markerli ro'yxatlar, OL va LI - raqamlangan ro'yxatlar, DL, DT va DD elementlari yordamida esa ta'riflar ro'yxati deb ataladigan ro'yxatlar tuziladi. Shuningdek, biz ichki tuzilmalarni yaratish tamoyillarini qisqacha ko'rib chiqamiz.

                                      Sizga eslatib o'tmoqchimanki, biz allaqachon zamonaviy, shuningdek, jadvalli tartib () asoslari haqida gapirishga muvaffaq bo'ldik. Bundan tashqari, biz asoslarga tegdik, yaxshi, biz o'rgandik.

                                      UL va LI teglari asosida markirovka qilingan roʻyxatlar

                                      UL tegi markirovka qilingan roʻyxatlar yaratish uchun, OL tegi esa raqamlangan roʻyxatlar yaratish uchun ishlatiladi. Bu teglar xuddi LI elementi kabi juftlangan va bloklangan teglardir.

                                      Alohida ro'yxat elementlari ochilish va yopish teglari o'rtasida joylashgan bo'lib, ular o'z navbatida LI ochilish va yopish elementiga qo'shiladi. Html ro'yxatlarining yuqori va pastki qismida brauzer paragraf yorlig'i tomonidan yaratilgan chekinishga o'xshash bir qatorli chekinishni qo'shadi.

                                      Keling, masalan, quyidagicha ko'rinishi mumkin bo'lgan etiketli versiyani ko'rib chiqaylik:

                                      • Birinchi qator
                                      • Ikkinchi
                                      • Oxirgi element

                                      Ochilish va yopish UL teglari ichida faqat LI elementlari joylashtirilishi mumkin va allaqachon ushbu elementlar (paragraflar) ichiga istalgan tarkibni (matn, rasmlar, sarlavhalar, paragraflar, havolalar va hatto boshqa ro'yxatlar) kiritishingiz mumkin.

                                      Bular. UL faqat markirovka qilingan (tartibsiz) ro'yxatni tashkil qilish uchun xizmat qiladi va uning ichidagi veb-sahifada ko'radigan barcha narsalar LI elementlarining mazmuni yordamida amalga oshiriladi.

                                      UL uchun markerning ko'rinishini undagi "Type" atributiga turli qiymatlarni o'rnatish orqali o'zgartirishingiz mumkin. Agar UL elementi uchun "Tip" (markerlarning ko'rinishini boshqarish) belgilanmagan bo'lsa, standart marker turi ko'rsatiladi (disk matn rangi bilan to'ldirilgan doiradir):

                                        • — toʻldirilgan doira (standart);
                                          • - to'ldirilmagan doira;
                                            • - kvadrat

                                      Yuqoridagi misollarda biz barcha elementlar uchun ushbu turdagi markerdan foydalangan holda UL elementida "Type" atributini yozdik. Lekin "Type" atributi har bir alohida LI yorlig'i uchun ham yozilishi mumkin, bu element uchun o'z marker turini o'rnatadi.

                                      Har bir element uchun turli xil o'q turlariga ega markerli ro'yxatga misol:

                                      1. To'ldirilgan disk belgisi
                                      2. Soyasiz disk ko'rinishidagi marker
                                      3. Kvadrat

                                      OL tegiga asoslangan Html-dagi raqamlangan ro'yxatlar

                                      Raqamlangan ro'yxatni yaratish uchun OL teglari ishlatiladi, ularning ichida yana LI elementlari joylashadi. OL va LI, yuqorida aytib o'tganimdek, blok darajasida (ya'ni, ular kenglikda ular uchun mavjud bo'lgan barcha bo'sh joyni egallashga moyildirlar) va OL ichiga LI elementlaridan tashqari hech narsa joylashtirilmaydi.

                                      Ma'lum bo'lishicha, OL va UL bu xizmat teglari bo'lib, ular faqat brauzerga qanday ro'yxat tuzayotganimizni bildirish uchun kerak bo'ladi (markerli yoki raqamlangan). Agar raqamlangan bo'lsa, har bir elementning chap tomonida biz markerni emas, balki uning orqasida raqam va nuqtani ko'ramiz:

                                      1. Birinchi qator
                                      2. Ikkinchi nuqta
                                      3. Uchinchi qator

                                      Yuqorida aytib o'tganimdek, UL, OL va LI elementlari TYPE atributidan foydalanish imkoniyatiga ega. Bu sizga marker turini o'rnatish yoki ro'yxat elementlari qanday raqamlar yoki harflar bilan raqamlanishini belgilash imkonini beradi. Tartiblangan ro'yxat uchun ushbu atributning parametrlari quyidagi qiymatlarni olishi mumkin:

                                        1. — raqamlash oddiy arab raqamlari bilan amalga oshiriladi ("Tur" atributi bo'lmasa, xuddi shu parametr sukut bo'yicha qo'llaniladi);
                                          1. - raqamlash sifatida bosh harflar;
                                            1. - kichik harf;
                                              1. - bosh rim raqamlari;
                                                1. - kichik rim raqamlari;

                                                Har bir element uchun har xil turdagi raqamlangan raqamlangan ro'yxatga misol:

                                                1. katta rim raqamlari bilan raqamlangan
                                                2. Kichik lotin harflarida raqamlash
                                                3. Kichik rim raqamlari bilan raqamlash

                                                Raqamlangan ro'yxatlarni yaratishda raqamlashni bittadan emas, balki START atributida ko'rsatilgan raqamdan boshlash ham mumkin. Masalan:

                                                1. OL tegida raqami start="23" atributi bilan ko'rsatilgan birinchi element
                                                2. Keyingi element, yana bir raqam bilan
                                                3. Yana bir

                                                OL uchun, shuningdek, ushbu elementning ochilish LI da VALUE atributini kerakli raqam bilan yozish orqali istalgan elementdan boshlab istalgan qiymatdan yangi raqamlashni boshlashingiz mumkin. Masalan:

                                                1. Birinchi raqam birinchi element
                                                2. Ushbu element atribut qiymatida ko'rsatilgan raqamni oladi = "32"
                                                3. Ko'p sonli element

                                                CSS-da ro'yxatlarning ko'rinishini shakllantirish (uslublar jadvallari)

                                                Ammo, qoida tariqasida, endi markerlarning ko'rinishi TYPE atributi orqali emas, balki tegishli xususiyatlar yoziladigan .

                                                Bu erda men tartibsiz ro'yxatlar uchun turli xil markerlarga misol keltiraman, ularning ko'rinishi kaskadli uslublar jadvallari bilan alohida fayl orqali o'rnatiladi.

                                                • Birinchi nuqta
                                                • Ikkinchi
                                                • Oxirgi

                                                Ammo biz bu haqda keyingi maqolalarda gaplashamiz. Ushbu blogda UL uchun markerlarning ko'rinishi shunday o'rnatiladi. Rasmlar marker sifatida ishlatiladi: raqamlanmagan roʻyxatning oddiy elementlari uchun — , raqamlanmagan roʻyxatning ichki oʻrnatilgan elementlari uchun — .

                                                Html kodidagi maxsus va ichki ro'yxatlar

                                                Uchinchi va oxirgi tur "ta'riflar ro'yxati" deb ataladi va ular uchta teg yordamida o'rnatiladi - DL, DT va DD. DL brauzerga ta'riflar ro'yxati kelishini aytadi.

                                                Odatda, bu tur atamalardan (DT teglariga kiritilgan) va ularning tavsiflaridan (DD teglariga kiritilgan) iborat lug'at yozuvlarini yozish uchun ishlatiladi (yoki ishlatilishi kerak edi).

                                                Birinchi muddat
                                                Tavsif
                                                Ikkinchi muddat
                                                Uning tavsifi

                                                Yuqoridagi misolni ko'rib chiqsangiz, DD elementi (termin tavsifi) DT elementiga (terminning o'zi) nisbatan (40px ga) siljiganligini sezasiz.

                                                Umuman olganda, DL, DT va DD blok teglari bo'lib, DT elementiga faqat inline teglari bo'lgan tarkibni kiritish mumkin (ma'lum bo'lishicha, sarlavhalar va paragraflarning blok elementlarini DT ichida ishlatib bo'lmaydi). Va DD teglari ichida siz har qanday elementlarni, ham inline, ham blokni kiritishingiz mumkin.

                                                joylashtirilgan ro'yxat Html da u oddiyga o'xshatish yo'li bilan yaratilgan, lekin asosiy ro'yxat ichida ba'zi elementlar yana UL yoki OL tegining ochilish va yopishiga kiritilgan.

                                                E'tibor bering, ichki element yaratiladigan elementning yopilish LI faqat joylashtirilgan ro'yxatning butun kodidan keyin joylashtiriladi (bu uning veb-sahifada to'g'ri ko'rsatilishi uchun juda muhimdir). Ichki ro'yxat quyidagicha ko'rinishi mumkin:

                                                1. Asosiy qismning birinchi xatboshi raqamlangan
                                                2. Ikkinchi nuqta
                                                  • Yorliqlangan ichki joyning birinchi elementi
                                                  • Ikkinchi
                                                  • Belgilangan uchinchi va oxirgi nuqta
                                                3. Raqamlangan uchinchi element

                                                Omad sizga! Tez orada blog sahifalari saytida ko'rishguncha

                                                Sizni qiziqtirishi mumkin

                                                HTML - IMG va A teglariga havola va rasmni (fotosuratni) qanday kiritish mumkin Tanlash, Variant, Textarea, Yorliq, Maydonlar to‘plami, Legend - ochiladigan ro‘yxat shakli va matn maydonining Html teglari
                                                Veb-forma elementlarini yaratish uchun sayt uchun HTML shakllari - teglar Form, Input va Select, Option, Textarea, Label va boshqalar.
                                                Html va CSS kodlarida ranglar qanday o'rnatiladi, jadvallarda RGB soyalarini tanlash, Yandex natijalari va boshqa dasturlar
                                                O'rnatish va ob'ekt - veb-sahifalarda media-kontentni (video, flesh, audio) ko'rsatish uchun Html teglari
                                                Html 4.01 standartiga muvofiq H1-H6 sarlavhalari teglari va atributlari, gorizontal chiziq Hr, chiziq uzilishi Br va paragraf P.
                                                Html-dagi jadvallar - Table, Tr va Td teglari, shuningdek ularni yaratish uchun Colspan, Cellpadding, Cellspacing va Rowspan
                                                Html gipermatnni belgilash tili nima va W3C validatoridagi barcha teglarni qanday ro'yxatga olish mumkin
                                                Shrift (Yuz, o'lcham va rang), Blockquote va Pre teglar - sof HTMLda eskirgan matn formatlash (CSS-dan foydalanmasdan)
                                                Iframe va Frame - ular nima va Html-da freymlardan qanday foydalanish yaxshiroq
                                                Img - Html yorlig'i tasvirni (Src) qo'shish, uni matn bilan tekislash va o'rash (tekislash), shuningdek fonni (fon) o'rnatish uchun.

                                                HTML har biri o'z turlariga ega bo'lgan uch xil turdagi ro'yxatlarni qo'llab-quvvatlaydi:

                                                  1. - har bir elementi seriya raqami (harf) 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 boshlab (odatda 1) tartibda kiritadi. Bu raqamlashni buzmasdan ro'yxat elementlarini kiritish va olib tashlash imkonini beradi, chunki qolgan raqamlar avtomatik ravishda qayta hisoblab chiqiladi.
                                                    Raqamlangan ro'yxatlar blok elementi yordamida tuziladi

                                                      (ingliz tilidan. Ordered List - raqamlangan ro'yxat). Konteyner yonida
                                                        ro'yxatdagi har bir element uchun element joylashtiriladi
                                                      1. (ingliz tilidan List Item - 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. Qulfdan kalitni oling
                                                          5. Eshikni ochish

                                                          Bosqichma-bosqich ko'rsatma

                                                          1. Kalitni oling
                                                          2. Kalitni qulfga soling
                                                          3. Kalitni ikki marta aylantiring
                                                          4. Qulfdan kalitni oling
                                                          5. Eshikni ochish

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

                                                            , bu raqamlash turini belgilash uchun ishlatiladi (harflar, rim va arab raqamlari va boshqalar). Sintaksis:

                                                              Bu erda: turi - ro'yxatdagi belgilar:

                                                              • A - katta 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 ko'rsatishingiz kerak boshlash teg

                                                                .
                                                                Quyidagi misol katta rim raqamlari va XLIX boshlang'ich qiymati bilan tartiblangan 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 yangidan boshlanadi, bunda 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 elementi" 7 raqami va "Ro'yxatning uchinchi elementi" 8 raqami bo'ladi.

                                                                CSS yordamida raqamlangan ro'yxatlarni formatlash

                                                                Ro'yxat raqamlarini o'zgartirish uchun xususiyatdan foydalaning 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 harflarda
                                                                  I, II, IIIyuqori rimRim 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 - tartibsiz ro'yxat). Ro'yxatning har bir 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 xatboshi
                                                                      • Uchinchi xatboshi

                                                                      Quyidagi misolda siz sukut bo'yicha har bir ro'yxat elementi oldiga kichik to'ldirilgan doira belgisi qo'shilganligini ko'rishingiz mumkin:

                                                                      Teg ichida

                                                                    • faqat matnni joylashtirish shart emas, oqimli tarkibning har qanday elementini (havolalar, paragraflar, rasmlar va boshqalar) joylashtirishga ruxsat beriladi.

                                                                      Oʻrnatilgan roʻyxatlar

                                                                      Har qanday ro'yxat boshqasiga joylashtirilishi mumkin. Element ichida
                                                                    • ichki ro'yxat yoki ikkinchi darajali ro'yxat yaratish mumkin. Roʻyxatni joylashtirish uchun element ichida yangi roʻyxatni tasvirlab bering
                                                                    • allaqachon mavjud ro'yxat. Bir markirovka qilingan ro'yxatni boshqasiga joylashtirishda 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 bandiga 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. Kechki xabarlarni ko'rish
                                                                      • seshanba
                                                                        1. Jadvalni qayta ko'rib chiqish
                                                                        2. Rasmlarni yuboring
                                                                      • Chorshanba...

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

                                                                      Belgilangan ro'yxatlarni formatlash

                                                                      Ro'yxat belgisining ko'rinishini o'zgartirish uchun xususiyatdan foydalaning ro'yxat uslubi turi css uslublar jadvallari:

                                                                        Quyidagi misolda markirovka qilingan roʻyxatlar uchun turli uslublar koʻrsatilgan:

                                                                        Misol: Belgilangan ro'yxat uslublari

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

                                                                        Disk:

                                                                        • Kofe
                                                                        • Sut

                                                                        doira:

                                                                        • Kofe
                                                                        • Sut

                                                                        kvadrat:

                                                                        • Kofe
                                                                        • Sut

                                                                        Yo'q:

                                                                        • Kofe
                                                                        • Sut

                                                                        Grafik belgilar.

                                                                        HTMLda grafik belgilar bilan ro'yxat yaratish mumkin. Ro'yxat belgilari standart doiralar yoki kvadratlar bo'lsa, bu boshqa narsa, va agar ishlab chiquvchi sahifa dizayniga muvofiq markerni o'zi tanlagan bo'lsa, bu 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 belgilang:

                                                                          Misol: Grafik markerlar

                                                                          • 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, atamalarning shaxsiy lug'atini yaratish uchun juda qulay. Ta'riflar ro'yxatidagi har bir element ikki qismdan iborat: atama va uning ta'rifi.
                                                                          Siz butun ro'yxatni elementga joylashtirasiz

                                                                          (ingliz tilidan. Ta'riflar ro'yxati - ta'riflar ro'yxati). U teglarni o'z ichiga oladi
                                                                          (ingliz tilidan. Ta'rif Term - belgilangan so'z, atama) va
                                                                          (ingliz tilidan. Definition Description - belgilangan muddatning tavsifi).
                                                                          Ta'riflar ro'yxati ko'pincha ilmiy, texnik va o'quv nashrlarida qo'llaniladi, ular yordamida lug'atlar, lug'atlar, ma'lumotnomalar va hokazolar tuziladi.

                                                                          Ta'riflar ro'yxatining umumiy tuzilishi quyidagicha:

                                                                          Birinchi muddat
                                                                          Birinchi atama tavsifi
                                                                          Ikkinchi muddat
                                                                          Ikkinchi atama tavsifi

                                                                          Quyidagi misol ta'riflar ro'yxatidan mumkin bo'lgan foydalanishni ko'rsatadi:

                                                                          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 o'zaro bog'langan hujjatlarga kirishni ta'minlaydigan taqsimlangan tizim. Internet ma'lumotlarni uzatish uchun yagona almashish protokolidan foydalanadigan tarmoqlar to'plamidir. Sayt - bu havolalar orqali bog'langan va umumiy dizaynga ega bo'lgan alohida veb-sahifalar to'plami.

                                                                          World Wide Web
                                                                          - ingliz tilidan. World Wide Web (WWW) - bu Internetga ulangan turli xil kompyuterlarda joylashgan o'zaro bog'langan hujjatlarga kirishni ta'minlaydigan taqsimlangan tizim.
                                                                          Internet
                                                                          - axborotni uzatish uchun yagona almashinuv protokolidan foydalanadigan tarmoqlar to'plami.
                                                                          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 joylashtirilgan va atama tavsifi quyida joylashgan va o'ngga siljigan.

                                                                          Belgilangan ro'yxatlar katta matnni alohida bloklarga bo'lish imkonini beradi, ularning har biri o'q bilan boshlanadi - odatda kichik nuqta. Bu esa o‘quvchi e’tiborini matnga qaratadi va uning o‘qishliligini oshiradi.

                                                                          Element bilan

                                                                            quyidagi xususiyatlar bilan bog'liq:

                                                                            • uchrashadigan joyda
                                                                                , brauzer avtomatik ravishda qatorni qo'shadi;
                                                                              • ro'yxatning yuqori va pastki qismida chekinishlar mavjud;
                                                                              • markerlar sukut bo'yicha to'ldirilgan doira sifatida ko'rsatiladi;
                                                                              • ro'yxatning har bir elementi asosiy matnga nisbatan o'ngga siljiydi.

                                                                              1-rasmda markirovka qilingan ro'yxatning yuqoridagi xususiyatlarini ko'rsatuvchi misol natijasi ko'rsatilgan.

                                                                              Guruch. 1. Belgilangan ro'yxatning ko'rinishi

                                                                              Marker turi

                                                                              Markerlar uchta shakldan birini olishi mumkin: to'ldirilgan doira (standart), bo'sh doira va kvadrat. Marker turini tanlash uchun list-style-type xususiyatidan yoki umumiy ro'yxat uslubidan foydalaning (1-misol). Quyidagi qiymatlar qo'llaniladi:

                                                                              • disk - to'ldirilgan doira shaklida markerlar;
                                                                              • doira - to'ldirilmagan doira shaklida markerlar;
                                                                              • kvadrat - kvadrat belgilar.

                                                                              1-misol - markerning ko'rinishini o'zgartiring

                                                                              Ro'yxatlar

                                                                              • qabr
                                                                              • qabriston
                                                                              • Sepuleniya

                                                                              Misol o'q belgisi sifatida kichik, tekis rangli kvadratdan foydalanadigan markirovka qilingan ro'yxatni qanday yaratishni ko'rsatadi. Qadriyatlar soni uchta bilan cheklangan bo'lsa-da, bu bizning ixtiyorimizda faqat uchta turdagi marker borligini anglatmaydi. Marker belgisi sifatida muvaffaqiyatli ishlay oladigan ko'plab maxsus belgilar mavjud. Ularni to'g'ridan-to'g'ri "vidalang"

                                                                            • ishlamaydi, shuning uchun siz ishlashingiz kerak. Buni amalga oshirish uchun roʻyxat belgilarini roʻyxat uslubi xususiyatidan foydalanib, “none” qiymatiga ega boʻlgan holda va kontentdan oldingi matnda yashiring.
                                                                            • pseudo-elementdan oldin :: bilan o'z belgilaringizni qo'shing. 2-misolda uchburchak shunday marker vazifasini bajaradi.

                                                                              2-misol: :: oldin foydalanish

                                                                              Ro'yxatlar

                                                                              • qabr
                                                                              • qabriston
                                                                              • Sepuleniya

                                                                              Ushbu misolning natijasi rasmda ko'rsatilgan. 2. None qiymati bilan list uslubidagi xossadan foydalanish markerlarni umuman olib tashlamaydi, faqat ularni ko‘rishdan yashiradi, shuning uchun ro‘yxat o‘ngga suriladi. Ushbu o'ziga xoslikdan xalos bo'lish uchun misol salbiy qiymatga ega bo'lgan text-indent xususiyatini qo'shadi. Uning vazifasi matnni bitta belgi bilan chapga siljitishdir.

                                                                              Guruch. 2. Ro‘yxatdagi ixtiyoriy belgilar

                                                                              Belgi o'n oltilik formatda bo'lishi shart emas, uni to'g'ridan-to'g'ri matnga kiritish ham mumkin. Asosiysi, hujjatni UTF-8 kodlashda saqlash va muharrir uni qo'llab-quvvatlashi. Belgilarning o'zlari va ularning kodlari, masalan, LibreOffice Writer'dan olinishi mumkin (3-rasm).

                                                                              Guruch. 3. LibreOffice-da belgi tanlash

                                                                              Chizilgan o'qlar bilan ro'yxat

                                                                              Uslublar list-style-image xususiyati orqali istalgan mos tasvirni marker sifatida belgilash imkonini beradi. Qiymat 3-misolda ko'rsatilganidek, grafik faylga nisbiy yoki mutlaq yo'ldir.

                                                                              3-misol: Tasvirni marker sifatida ishlatish

                                                                              Ro'yxatlar

                                                                              • qabr
                                                                              • qabriston
                                                                              • Sepuleniya

                                                                              Ro'yxat elementlarini rasm sarlavhalariga aylantirmaslik uchun kichik o'lchamdagi rasmni tanlash yaxshidir. Shaklda. 4 kichik rasmlarni marker sifatida ishlatish uchun misol harakati natijasini ko'rsatadi.

                                                                              Guruch. 4. Marker sifatida chizish

                                                                              List-style-rasmning ba'zi kamchiliklari bor:

                                                                              • naqshni yuqoriga yoki pastga siljitib bo'lmaydi;
                                                                              • turli brauzerlarda tasvirning matnga nisbatan joylashuvi farq qilishi mumkin.

                                                                              Ushbu muammolarni fon tasvirini o'rnatadigan fon xususiyatidan foydalanib oldini olish mumkin. Har bir ro'yxat elementi uchun

                                                                            • biz asl markerlarni olib tashlaymiz va takrorlanmasdan fon tasvirini o'rnatamiz. Matn rasmning tepasida ko'rsatilmasligi uchun uni to'ldirish-chap orqali o'ngga siljitamiz (4-misol).

                                                                              4-misol fondan foydalanish

                                                                              Ul (chekka chap: -1em; ) li (roʻyxat uslubi: yoʻq; fon: url(images/bullet.png) takrorlanmaslik 0 2px; toʻldirish-chap: 20px; )

                                                                              Matn va o'q o'rni

                                                                              Matnga nisbatan markerni joylashtirishning ikki yo‘li mavjud: marker ro‘yxat elementlari chegarasidan tashqarida joylashtiriladi yoki matn bilan o‘raladi (5-rasm).



                                                                              ichidatashqarida

                                                                              Guruch. 5. Matnga nisbatan markerlarni joylashtirish

                                                                              Ro'yxat uslubidagi joylashuv xususiyati markerlarning o'rnini boshqarish uchun ishlatiladi. Uning ikkita ma'nosi bor: tashqarida - o'qlar matn blokidan tashqarida joylashgan (bu standart) va ichkarida - o'qlar matn blokining bir qismi bo'lib, ro'yxat bandida ko'rsatiladi (5-misol).

                                                                              Misol 5. Markerlarning o'rnini o'zgartiring

                                                                              Ro'yxatlar

                                                                              • Ishni boshlashdan oldin, 3BM to'plamiga kiritilgan uskunaning mavjudligini tekshiring.
                                                                              • Bir yoki bir nechta periferik qurilmalar bo'lmasa, darhol CCning texnik xodimlariga murojaat qilishingiz kerak.
                                                                              • Ish joyingizni vizual tekshirgandan so'ng, siz 3BM ni diqqat bilan yoqishingiz mumkin.

                                                                              Ushbu misolning natijasi rasmda ko'rsatilgan. 6.