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).
- (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.
- .
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
-
teg
-
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
- 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 gachaUshbu 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
- 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
- (inglizcha ro'yxat elementidan).
- mavjud.
- Microsoft
- olma
2. Raqamlangan ro'yxat
Raqamlangan ro'yxat juftlangan teg yordamida yaratiladi. Har bir ro'yxat elementi element yordamida ham yaratiladi
- raqam bilan belgilanadi
- . 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:
- Microsoft
- olma
- 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:
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- paragraf
- 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
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).3. Ta'riflar ro'yxati
Ta'riflar ro'yxati teg yordamida yaratiladi
Ta'riflar ro'yxati blokida quyidagi standart brauzer uslublari mavjud:
Teglar uchun
- ,
HTML uchta ro'yxatni qo'llab-quvvatlaydi turli xil turlari, ularning har biri o'z parametrlariga ega:
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
teg- element 1
- element 2
- 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"
- Kalitni oling
- Kalitni qulfga soling
- Kalitni ikki marta aylantiring
- Kalitni qulfdan chiqarib oling
- Eshikni ochish
Bosqichma-bosqich ko'rsatma
- Kalitni oling
- Kalitni qulfga soling
- Kalitni ikki marta aylantiring
- Kalitni qulfdan chiqarib oling
- Eshikni ochish
Ba'zan mavjud HTML kodlarini ko'rib chiqishda siz argumentga duch kelasiz turi elementda
- 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).
- quyida bayon qilinganidek:
-
Bunday holda, ro'yxatning ketma-ket raqamlanishi to'xtatiladi va shu vaqtdan boshlab raqamlash yana boshlanadi, bu holda ettidan.
Atributlardan foydalanish misoli qiymat teg
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:
- . Brauzer ro'yxatning har bir elementini cheklaydi va avtomatik ravishda markerlarni ko'rsatadi.
- Birinchi nuqta
- Ikkinchi nuqta
- Uchinchi nuqta
- Faqat matnni joylashtirish shart emas, oqimli tarkibning har qanday elementini (havolalar, paragraflar, rasmlar va boshqalar) joylashtirish mumkin.
- 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.
- O'zingiz sinab ko'ring"
- dushanba
- Pochta yuboring
- Muharrirga tashrif
- Mavzu tanlash
- Dekorativ dizayn
- Yakuniy hisobot
- Kechqurun xabarlarni ko'rish
- seshanba
- Jadvalni qayta ko'rib chiqish
- Rasmlarni yuborish
- Chorshanba...
- dushanba
- Pochta yuboring
- Muharrirga tashrif
- Mavzu tanlash
- Dekorativ dizayn
- Yakuniy hisobot
- Kechqurun xabarlarni ko'rish
- seshanba
- Jadvalni qayta ko'rib chiqish
- Rasmlarni yuborish
- Chorshanba...
- O'zingiz sinab ko'ring"
- Kofe
- Kofe
- Kofe
- Kofe
- Kofe
- Sut
- Kofe
- Sut
- Kofe
- Sut
- Kofe
- Sut
- O'zingiz sinab ko'ring"
- Toros
- Egizaklar
- Qo'y
- Toros
- Egizaklar
- (inglizcha ta'rif atamasidan - belgilangan so'z, atama) va
- (inglizcha ta'rif tavsifidan - aniqlanayotgan atamaning tavsifi).
- Birinchi muddat
- Birinchi atama tavsifi
- Ikkinchi muddat
- Ikkinchi atama tavsifi
- 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 almashuv protokolidan foydalanadigan tarmoqlar majmui.
- Veb-sayt
- - havolalar va yagona dizayn bilan o'zaro bog'langan alohida veb-sahifalar to'plami.
- 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.
- . 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 - Ish joyingizga yaxshi g'amxo'rlik qilishingiz kerak.
- Xonadagi yoritishni yorug'lik manbai operatorning yon tomonida yoki orqasida joylashgani uchun sozlang.
- 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 - Birinchidan
- Ikkinchi
- Uchinchi
- 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
- Bir
- Ikki
- 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 - Borsch
- Pike kotletlari
- Kulebyaka
- Smetanadagi qo'ziqorinlar
- Ikra bilan pancakes
- kvas
Natija bu misol shaklda ko'rsatilgan. 3.
Raqamlangan ro'yxat uslublari
Misol Ma'nosi Tavsif a, b, c pastki alfa Kichik harf A, B, C yuqori alfa Bosh harflar i, ii, iii pastki rim Rim raqamlari kichik harflar bilan I, II, III yuqori roman Rim 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
tegQuyidagi misolda, sukut bo'yicha, ro'yxatning har bir elementi oldiga to'ldirilgan doira shaklida kichik marker qo'shilganligini ko'rishingiz mumkin:
Teg ichida
Oʻrnatilgan roʻyxatlar
Har qanday ro'yxat boshqasiga joylashtirilishi mumkin. Element ichidaMisol: Ichki ro'yxatlar
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
Disk:
Davra:
Kvadrat:
Yo'q:
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
Burj belgilari
Burj belgilari
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
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:
Quyidagi misol ulardan birini ko'rsatadi mumkin bo'lgan foydalanish ta'riflar ro'yxati:
Misol: Ta'riflar ro'yxati
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.
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:
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
Bu erda: yozing - belgilar ro'yxati:
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
teg
- Butun ro'yxatning boshi/oxiri belgilangan.
teg
- alohida ro'yxat elementining boshini/oxirini ko'rsating.
teg
-
-
- , alohida ro'yxat elementlariga ishora qilib, chiqishni taqdim eting standart belgilar ro'yxat elementlari.
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
- .
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