IN HTML jezik predviđen je poseban set oznaka za predstavljanje informacija u obliku lista. Liste su jedan od najčešće korištenih oblika predstavljanja podataka u oba elektronski dokumenti, kao i u štampi. Vidimo liste skoro svakodnevno, bilo da je to lista stvari koje treba da uradimo u prodavnici, učenici u učionici ili samo stvari koje treba da uradimo. Mogućnost organiziranja struktura lista dostupna je u mnogima uređivači teksta posebno moćan program za obradu teksta Microsoft Word ima zgodne alate za formatiranje lista različitih tipova (mogućnost kreiranja HTML lista kada pomoć od Microsofta Word se razmatra u 8. poglavlju). Evo nekoliko slučajeva u kojima je korištenje lista prilično zgodno:
- Kombiniranje dijelova informacija u jednu strukturu kako bi se dobio čitljiv izgled.
- Opis složenih procesa korak po korak.
- Raspored informacija u stilu tabele sadržaja, čiji paragrafi upućuju na relevantne delove dokumenta.
Imajte na umu da su gore navedene stavke samo organizirane u obliku strukture liste.
HTML pruža sljedeće glavne tipove lista: lista sa nabrajanjem, numerisana i lista definicija. Sljedeće oznake se koriste za implementaciju lista različitih tipova:
- ,
- (LI - Stavka liste, stavka liste). Tag
- ne treba odgovarajuću završnu oznaku, iako njeno prisustvo u principu nije zabranjeno. Preglednici obično započinju svaku novu stavku liste u novom redu kada prikazuju dokument.
Gore navedene informacije su dovoljne da se napravi elementarna lista sa nabrajanjem. Evo primjera HTML dokumenta koji koristi listu sa nabrajanjem, čije je prikazivanje pretraživača prikazano na Sl. 2.1.
Primjer liste s nabrajanjem - Ovan
- Bik
- Blizanci
- Rak
- lav
- Djevica
- vage
- Škorpion
- Strijelac
- Jarac
- Vodolija
- Ribe
horoskopski znakovi:
Rice. 2.1. Prikaz liste sa nabrajanjem u pretraživaču
Imajte na umu da pored stavki liste označenih oznakom
- , mogu biti prisutni i drugi HTML elementi. U gornjem primjeru, jedan od ovih elemenata je običan tekst, koji nije stavka liste, ali igra ulogu svog naslova.
Bilješka
U nekim udžbenicima o HTML jeziku postoji naznaka da se oznaka kontejnera treba koristiti za postavljanje naslova liste
(LH - Zaglavlje liste, zaglavlje liste). Ovu oznaku trenutno ne prepoznaje nijedan od uobičajenih pretraživača i nije dio HTML specifikacije. Time njegova upotreba postaje besmislena, iako neće dovesti do grešaka. U oznaci
- mogu se specificirati dva parametra: COMPACT i TYPE.
- .
Primjer snimanja:
-
.
Bilješka
Pretraživači tumače indikaciju tipa markera na različite načine za pojedinačni element lista. Netscape pretraživač mijenja izgled markera za ovaj i sve naredne dok se ne naiđe na sljedeću redefinaciju izgleda markera. Internet pretraživač Explorer mijenja izgled markera samo za dati element.
Navedite grafičke markere
Možete koristiti grafičke slike kao markere liste, što se široko koristi za kreiranje atraktivnih, lijepo dizajniranih HTML dokumenata. U stvari, ovu mogućnost ne pruža direktno HTML jezik, već je implementirana donekle umjetno. To ne znači da se to ne preporučuje ili zamjerava, već samo da se ovdje neće koristiti posebne konstrukcije HTML jezika.
Da biste razumjeli ideju, morate razumjeti kako se liste implementiraju u HTML stranice. Ispostavilo se da je oznaka liste
- (kao i liste tagova drugih tipova o kojima se govori u nastavku) obavlja jedini zadatak - ukazuje pretraživaču da sve informacije koje se nalaze nakon ove oznake trebaju biti prikazane sa pomakom udesno (uvlačenje) za određeni iznos. oznake
- Pokazivanje na pojedinačne stavke liste daje standardne markere stavki liste.
Ako treba da napravimo listu sa grafičkim markerima, onda uopšte možemo bez oznaka
- . Biće dovoljno da umetnete željenu grafičku sliku ispred svakog elementa liste. Jedini zadatak koji treba riješiti u ovom slučaju je razdvojiti elemente liste jedan od drugog. Za ovo možete koristiti oznake pasusa.
Ili prinudno prebacivanje linije
. Primjer implementacije liste sa grafičkim markerima, čiji je prikaz prikazan na sl. 2.2 je prikazano ispod:bulleted list horoskopski znakovi:
Ovan
Bik
Blizanci
Pack
Leo
Djevica
vage
Škorpion
Strijelac
Jarac
Vodolija
Ribe
Rice. 2.2. Lista sa grafičkim oznakama
U datom primjeru, grafička datoteka Green_ball.gif se koristi kao marker elementa liste. Imajte na umu da upotreba grafike na HTML stranicama može značajno povećati količinu informacija koje se prenose. Međutim, u ovaj slučaj ovo povećanje je izuzetno malo. Ovdje se isti fajl koristi za sve markere,
koji će biti prenošen samo jednom. Veličina datoteke koja sadrži malu sliku je također izuzetno mala.
Bilješka
Tehnike za kreiranje lista sa grafičkim markerima razmatrane su redom u Poglavlju 8.
numerisana lista
Drugi tip liste implementiran u HTML-u je numerisana lista. Inače, liste ovog tipa nazivaju se uređenim. Prezime se često koristi kao formalni prijevod odgovarajućeg naziva oznake.
- , uz pomoć kojih se liste ovog tipa organizuju u HTML dokumente (OL - Ordered List, uređena lista).
- .
Evo primjera HTML dokumenta koji koristi numerisanu listu, čiji prikaz pretraživač je prikazan na sl. 2.3.
Primer numerisane liste - Sirius
- K anopus
- Arcturus
- Alpha Centauri
- Vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
. . .- Mizar
. . .- Polar
Najsjajnije zvezde vidljive sa Zemlje su:
Rice. 2.Z. numerisana lista
U oznaci
- mogu se specificirati sljedeći parametri: COMPACT, TYPE i START.
- .
Primjer snimanja:
- .
Parametar oznake START
- omogućava vam da započnete numerisanje liste ne od jedne. Vrijednost parametra START uvijek mora biti prirodan broj, bez obzira na tip numeracije liste. Evo primjera:
- za numerisane liste, dozvoljava upotrebu parametara TYPE i VALUE. Parametar TYPE može imati iste vrijednosti kao i za oznaku
- .
- .
Bilješka
Preglednici interpretiraju indikaciju tipa numeracije za pojedinačnu stavku liste na različite načine. Netscape pretraživač mijenja numeraciju za ovaj element i sve naredne elemente dok se ne naiđe na sljedeće nadjačavanje. Internet Explorer mijenja samo izgled broja za ovaj element.
Wvrijednost parametra VALUE oznake
- - omogućava vam da promijenite broj datog elementa liste. Ovo mijenja numeraciju svih narednih elemenata. Tipična upotreba je za liste u kojima su neki elementi izostavljeni. Primjer takve liste dat je gore (slika 2.3). Daje uređenu listu najsjajnijih zvijezda, u kojoj se na 58 i 75 mjesta nalaze zvijezde koje su jasno vidljive na našim geografskim širinama (Mizar je najsjajnija zvijezda u sazviježđu Velikog medvjeda, a Sjevernjača je Mali medvjed).
Evo još jednog originalnog primjera upotrebe različitih tipova numeracije. HTML kod ispod definiše tri liste sa različitim brojevima. Radi lakšeg pregleda, svaka od lista je smeštena u posebnu ćeliju tabele. Sve tri liste su identične i razlikuju se samo po vrsti numeracije: u prvoj koloni tabele - arapski brojevi, u drugoj - rimski, au trećoj numeracija je latiničnim slovima. Imajte na umu da su elementi liste prazni, odnosno iza bilo koje oznake
- nema podataka. Primjer ove vrste može se koristiti kao tabela korespondencije između arapskih i rimskih brojeva. Ispostavilo se da bilo koji pretraživač koji podržava liste može da se koristi za generisanje takve tabele (slika 2-4) sve dok ukucate dati HTML kod. Numeracija rimskim brojevima radi ispravno do vrijednosti 3999. Proučavanjem desne kolone možete razumjeti kako se izvodi numeriranje latiničnim slovima. Nakon iscrpljivanja jednoslovne numeracije (od A do Z), kao sljedeći broj uzima se prvi dvoslovni broj - AA itd.
Upotreba razne vrste numerisanje u listama -
. . .
-
. . .
-
. . .
Rice. 2.4. Različiti tipovi numerisanja HTML liste
Lista definicija
Liste definicija, koje se nazivaju i rječnici definicija termina, posebna su vrsta liste. Za razliku od drugih tipova lista, svaki element liste definicija uvijek se sastoji od dva dijela. Prvi dio elementa liste sadrži definirani pojam, a drugi dio sadrži tekst u obliku rječničkog unosa koji otkriva značenje pojma.
Liste definicija su specificirane pomoću oznake kontejnera
- (Definicijska lista). Unutar oznake kontejnera
- (Definicijski termin) definirani pojam je označen, a oznaka
- (Opis definicije) - paragraf sa svojom definicijom. Za oznake
- I
- možete izostaviti odgovarajuće krajnje oznake.
Općenito, lista definicija je napisana na sljedeći način:
- Termin
- Definicija pojma
U tekstu iza oznake
- elementi na nivou bloka, kao što su oznake pasusa, ne mogu se koristiti
ili naslovima
-
. Kao opšte pravilo, tekst pojma koji se definiše treba da bude u jednom redu. Tekst koji sadrži definiciju pojma se prikazuje počevši od sljedeći red(ili linija za neke pretraživače) nakon definicije pojma, uvučena udesno. U informacijama postavljenim iza oznake
- , elementi na nivou bloka mogu se postaviti. Iz toga posebno slijedi da se liste definicija mogu ugniježditi.
U oznaci
- parametar COMPACT može biti specificiran, čija je svrha slična ostalim gore opisanim listama.
- Flegmatična osoba
- Pasivan, vrlo sposoban, sporo se prilagođava;
raspoloženje je stabilno, malo podložno vanjskim utjecajima;
letargija emocionalnih reakcija i sporost u voljnoj aktivnosti
- sanguine
- Aktivan, energičan, prilagodljiv, -
živost i pokretljivost emocionalnih reakcija, brzina i snaga voljnih manifestacija
- Kolerik
- Aktivan, veoma energičan, uporan;
impulzivnost i jačina emocionalnih reakcija, nasilne voljne manifestacije
- melanholic
- Pasivan, lako se zamara, teško se prilagođava -
slabost voljnih manifestacija i prevladavanje depresivnog raspoloženja, sumnje u sebe - Zempa
- mjesec
- mapc
- Fobos
- Deimos
- Uran
- Ariel
- Umbriel
- Titania
- Oberon
- Miranda
- Neptun
- Triton
- Nereid
Drugi tip liste implementiran u HTML-u je numerisana lista. Inače, HTML liste ovog tipa nazivaju se uređenim. Prezime se često koristi kao formalni prijevod odgovarajućeg naziva oznake.
- , uz pomoć kojih se liste ovog tipa organizuju u HTML dokumente (OL - Ordered List, uređena lista).
- .
Evo primjera HTML dokumenta koji koristi numerisanu listu, čiji prikaz pretraživač je prikazan na sl. 2.3.
Primer numerisane liste Najsjajnije zvezde vidljive sa Zemlje su:
- Sirius
- K anopus
- Arcturus
- Alpha Centauri
- Vega
- K apella
- Rigel
- Procyon
- Achernar
- Beta Centauri
- Vetelgeuse
- Aldebaran
- Mizar
- Polar
Rice. 2.Z. numerisana lista
U oznaci
- mogu se specificirati sljedeći parametri: COMPACT, TYPE i START.
- .
Primjer snimanja:
- .
Parametar oznake START
- omogućava vam da započnete numerisanje liste ne od jedne. Vrijednost parametra START uvijek mora biti prirodan broj, bez obzira na tip numeracije liste. Evo primjera:
- za numerisane liste, dozvoljava upotrebu parametara TYPE i VALUE. Parametar TYPE može imati iste vrijednosti kao i za oznaku
- .
- .
Bilješka
Preglednici interpretiraju indikaciju tipa numeracije za pojedinačnu stavku liste na različite načine. Netscape pretraživač mijenja numeraciju za ovaj element i sve naredne elemente dok se ne naiđe na sljedeće nadjačavanje. Internet Explorer mijenja samo izgled broja za ovaj element.
Vrijednost parametra VALUE oznake
- - omogućava vam da promijenite broj datog elementa liste. Ovo mijenja numeraciju svih narednih elemenata. Tipična upotreba je za liste u kojima su neki elementi izostavljeni. Primjer takve liste dat je gore (slika 2.3). Daje uređenu listu najsjajnijih zvijezda, u kojoj se na 58 i 75 mjesta nalaze zvijezde koje su jasno vidljive na našim geografskim širinama (Mizar je najsjajnija zvijezda u sazviježđu Velikog medvjeda, a Sjevernjača je Mali medvjed).
Evo još jednog originalnog primjera upotrebe različitih tipova numeracije. HTML kod ispod definiše tri liste sa različitim brojevima. Radi lakšeg pregleda, svaka od lista je smeštena u posebnu ćeliju tabele. Sve tri liste su identične i razlikuju se samo po vrsti numeracije: u prvoj koloni tabele - arapski brojevi, u drugoj - rimski, au trećoj numeracija je latiničnim slovima. Imajte na umu da su elementi liste prazni, odnosno iza bilo koje oznake
- nema podataka. Primjer ove vrste može se koristiti kao tabela korespondencije između arapskih i rimskih brojeva. Ispostavilo se da bilo koji pretraživač koji podržava liste može da se koristi za generisanje takve tabele (slika 2-4) sve dok ukucate dati HTML kod. Numeracija rimskim brojevima radi ispravno do vrijednosti 3999. Proučavanjem desne kolone možete razumjeti kako se izvodi numeriranje latiničnim slovima. Nakon iscrpljivanja jednoslovne numeracije (od A do Z), kao sljedeći broj uzima se prvi dvoslovni broj - AA itd.
Korištenje različitih tipova numeracije u listama
. . .Rice. 2.4. Različiti tipovi numerisanja HTML liste
HTML podržava liste od tri različite vrste, od kojih svaki ima svoje uslove:
Numerisane liste
U numerisanu listu, pretraživač automatski ubacuje brojeve elemenata po redosledu, počevši od neke vrednosti (obično 1). Ovo vam omogućava da ubacite i uklonite stavke liste bez ometanja numeracije, budući da će se preostali brojevi automatski ponovo izračunati.
Numerisane liste se kreiraju korišćenjem blok elementa
Tag- element 1
- element 2
- element 3
Numerirane stavke liste moraju sadržavati više stavki liste, kao što je prikazano u sljedećem primjeru:
Primjer: Numerirana lista
- Probajte sami"
- Uzmi ključ
- Ubacite ključ u bravu
- Okrenite ključ za dva okreta
- Uzmi ključ iz brave
- Otvoriti vrata
Korak po korak instrukcije
- Uzmi ključ
- Ubacite ključ u bravu
- Okrenite ključ za dva okreta
- Uzmi ključ iz brave
- Otvoriti vrata
Ponekad kada gledate postojeće HTML kodove, naići ćete na argument tip u elementu
- A - velika latinična slova (A, B, C . . .);
- a - mala latinična slova (a, b, c . . .);
- I - veliki rimski brojevi (I, II, III . . .);
- i - mali rimski brojevi (i, ii, iii . . .);
- 1 - arapski brojevi (1, 2, 3 . . .) (koristi se prema zadanim postavkama).
- na sljedeći način:
-
U tom slučaju, sekvencijalno numerisanje liste će biti prekinuto i od ove tačke numerisanje će početi iznova, u ovom slučaju od sedam.
Primjer upotrebe atributa vrijednost tag
U ovom primjeru, "Prva stavka liste" bi bila broj 1, "Stavka druge liste" bi bila broj 7, a "Third List Item" bi bila broj 8.
Formatiranje numerisanih lista pomoću CSS-a
Za promjenu brojeva liste koristite svojstvo tip-stil liste css stilovi:
- . Pretraživač uvlači svaku stavku liste i automatski prikazuje znakove za nabrajanje.
- Prva tačka
- Druga tačka
- Treći paragraf
- nije potrebno postavljati samo tekst, dozvoljeno je postavljanje bilo kojeg elementa streaming sadržaja (linkova, pasusa, slika itd.)
- moguće je kreirati ugniježđenu listu ili listu drugog nivoa. Da biste ugnijezdili listu, opišite novu listu unutar elementa
- već postojeća lista. Kada ugnezdi jednu listu sa nabrajanjem u drugu, pretraživač automatski menja stil za nabrajanje za listu drugog nivoa. Bilo koja lista može biti ugniježđena u drugu. Sljedeći primjer pokazuje strukturu liste sa nabrajanjem ugniježđene u drugu stavku numerisane liste.
- Probajte sami"
- ponedjeljak
- Pošalji mail
- Posjeta uredniku
- Izbor teme
- Dekorativni dizajn
- Završni izvještaj
- Večernje gledanje poruka
- utorak
- Revidirati raspored
- Pošaljite slike
- srijeda...
- ponedjeljak
- Pošalji mail
- Posjeta uredniku
- Izbor teme
- Dekorativni dizajn
- Završni izvještaj
- Večernje gledanje poruka
- utorak
- Revidirati raspored
- Pošaljite slike
- srijeda...
- Probajte sami"
- Kafa
- Kafa
- Kafa
- Kafa
- Kafa
- Mlijeko
- Kafa
- Mlijeko
- Kafa
- Mlijeko
- Kafa
- Mlijeko
- Probajte sami"
- Bik
- Blizanci
- Ovan
- Bik
- Blizanci
- (od engleskog. Definicija Term - definirana riječ, pojam) i
- (od engleskog. Definition Description - opis definisanog pojma).
- Prvi mandat
- Opis prvog pojma
- Drugi mandat
- Opis drugog termina
- Probajte sami"
- World Wide Web
- - sa engleskog. World Wide Web (WWW) je distribuirani sistem koji omogućava pristup međusobno povezanim dokumentima koji se nalaze na različitim računarima povezanim na Internet.
- Internet
- - skup mreža koje koriste jedan protokol razmjene za prijenos informacija.
- Website
- - skup zasebnih web stranica koje su međusobno povezane linkovima i jedinstvenim dizajnom.
- kao što je prikazano ispod.
- Prva tačka
- Druga tačka
- Treći paragraf
Ako ne navedete nikakve dodatne atribute i samo napišite oznaku
- , tada se lista sa arapskim brojevima (1, 2, 3,...) koristi po defaultu, kao što je prikazano u primjeru 11.3.
- stvaranje tačnosti (nikada ni za šta nećete zakasniti);
- lijek za tačnost (nikad nećete žuriti);
- promjena u percepciji vremena i satova.
- arapski brojevi (1, 2, 3, ...);
- velika latinična slova (A, B, C, ...);
- mala latinična slova (a, b, c, ...);
- veliki rimski brojevi (I, II, III, ...);
- mali rimski brojevi (i, ii, iii, ...).
- Kralj Magnum XLIV
- Kralj Zigfrid XVI
- Kralj Sigismund XXI
- Kralj Husbrandt I
- :
Numerisana lista:
- Kafa
- Tea
- Mlijeko
napomena: oznaka
- as podređeni elementi može sadržavati samo oznake
- , odnosno cijeli sadržaj numerisane liste mora biti smješten unutar elemenata
- . Tag
- , zauzvrat, nema ograničenja na sadržaj, tako da u njega možete postavljati pasuse, slike, linkove, tabele, druge liste itd.
bulleted list
bulleted list- to su neuređene, odnosno neuređene liste elemenata čiji redoslijed nije bitan. Sve stavke liste za nabrajanje imaju iste oznake za nabrajanje, po defaultu se prikazuju kao mali crni krugovi.
HTML oznaka se koristi za kreiranje lista sa nabrajanjem.
- , unutar koje se nalaze elementi same liste (kao u slučaju numerisanih lista, koristi se oznaka
- , koji sadrži sav prikazani sadržaj liste):
Nabrajana lista:
- Kafa
- Tea
- Mlijeko
Vrste markera
Tipovi metaka u numerisanoj listi mogu se promeniti pomoću atributa tipa. Ovaj atribut podržava pet tipova markera:
Liste sa nabrajanjem nemaju atribut tipa, tako da ne možete promijeniti tip oznake u listi za nabrajanje koristeći HTML. Za promjenu vrste markera, u ovom slučaju, možete koristiti CSS svojstvo m list-style-type , s kojim, osim zadane vrijednosti, možete odabrati još dvije vrste markera: krug ili kvadrat.
Promjena markera za liste:
Naslov stranice Numerisana lista sa atributom type="a":
- Jabuke
- Banane
- Limuni
Numerisana lista sa atributom type="I":
- Jabuke
- Banane
- Limuni
Vrste markera liste sa nabrajanjem:
- Jabuke
- Banane
- Limuni
- Jabuke
- Banane
- Limuni
CSS svojstvo tipa stila liste, pored tipova za nabrajanje za liste sa nabrajanjem, ima mnogo različitih tipova nabrajanja za numerisane liste. Ali nije uvijek mijenjanje jednog standardnog tipa markera u drugi dovoljno za lijepo dizajniranje liste. Da biste dizajnirali liste, bolje je koristiti CSS, koji vam omogućava ne samo da promijenite izgled markera, već i da zamijenite markere slikama, kontrolirate njihovu lokaciju i kontrolirate uvlačenje. Možete vidjeti kako se sve ovo radi.
horizontalna lista
Ako koristite HTML listu za kreiranje horizontalnog menija, onda ćete morati da rasporedite stavke liste jednu pored druge u istoj liniji. Ne možete to učiniti s HTML-om, pa ćete morati koristiti CSS.
Da biste kreirali horizontalnu listu, morate postaviti CSS svojstvo prikaza stavki liste na inline ili inline-block, ovisno o tome koja druga svojstva ćete koristiti.
Naslov stranice numerisana lista
- Jabuke
- Banane
- Limuni
Nabrajana lista:
- Jabuke
- Banane
- Limuni
Nakon toga, sve stavke na listi će se postaviti u jedan red. Imajte na umu da će oznake za nabrajanje nestati sa stavki liste i da neće biti čak ni razmaka između njih, ali će ostati uvlaka na lijevoj strani liste.
Kako horizontalnu listu pretvoriti u horizontalni meni, možete vidjeti.
- , koji sadrži sav prikazani sadržaj liste):
Primjer 11.3. Napravite numerisanu listu
numerisana lista Rad sa vremenom
Rezultat ovog primjera prikazan je na sl. 11.3.
Rice. 11.3. Prikaz numerisane liste
Imajte na umu da numerisana lista takođe dodaje automatsko uvlačenje na vrh, dno i levo od teksta.
Sljedeće vrijednosti mogu djelovati kao elementi numeriranja:
Atribut tipa oznake koristi se za označavanje tipa numerisane liste.
- . Njegove moguće vrijednosti su date u tabeli. 11.2.
Tab. 11.2. Tipovi numerisanih lista
Vrsta liste HTML kod Primjer arapski brojevi
1. Cheburashka
2. Krokodil Gena
3. ShapoklyakVelika slova latinice
A. Cheburashka
B. Krokodil Gena
C. ShapoklyakMala slova latinice
a. Cheburashka
b. Krokodil Gena
c. ShapoklyakRimski brojevi u velikim slovima
I. Cheburashka
II. Krokodil Gena
III. ShapoklyakRimski brojevi u malim slovima
i. Cheburashka
ii. Krokodil Gena
iii. ShapoklyakDa biste započeli listu sa određenom vrijednošću, koristite start atribut oznake
- . Nije bitno koji je tip liste postavljen sa tipom, startni atribut radi isto i za rimske i za arapske brojeve. Primjer 11-4 pokazuje kako napraviti listu koristeći velike rimske brojeve koji počinju sa osam.
Primjer 11.4. Numeracija liste
Rimski brojevi Rezultat ovog primjera prikazan je na sl. 11.4.
Rice. 11.4. Numerisana lista sa rimskim brojevima
U HTML-u, cijeli skup oznaka je odgovoran za organiziranje lista, čija organizacija mora biti u skladu sa određenim pravilima strukturiranja podataka.
Peti standard html verzije Podržane su 3 vrste lista: numerisane liste, liste sa nabrajanjem i liste definicija. Takođe pruža mogućnost ugniježđenja lista jedne u drugu, kreirajući ugniježđene liste na više nivoa.
numerisana lista
numerisana lista je skup elemenata (stavki liste) koji imaju određeni niz. Svaka stavka u numerisanoj listi ima jedinstveni marker koji označava redosled stavke u odnosu na druge stavke na listi. Po defaultu, numerisani markeri stavki liste su brojevi. Prva stavka ide pod broj 1, druga pod broj 2 i tako dalje.
Najčešći primjeri numerisanih lista su recepti za kuhanje raznih jela. Pošto je svaki recept numerisana lista, sa jasnim redosledom radnji.
Da biste kreirali numerisane liste u HTML-u, koristite oznaku
- , unutar kojeg se nalaze elementi liste sa podacima. Svaka stavka liste je identificirana oznakom.
Stilovi numerisane liste
Primjer Značenje Opis a, b, c niži alfa Mala slova A, B, C gornji alfa Velika slova i, ii, iii donji roman Rimski brojevi malim slovima I, II, III gornji rimski Rimski brojevi velikim slovima Primjer: Primjena CSS svojstva tip-stil liste
Bulleted Lists
Bulleted Lists suštinski slični numerisanim, samo što ne sadrže sekvencijalno numerisanje pasusa. Liste sa oznakama se kreiraju pomoću elementa bloka
TagU sljedećem primjeru možete vidjeti da je, prema zadanim postavkama, mali popunjeni marker kruga dodan ispred svake stavke liste:
Unutar oznake
Ugniježđene liste
Bilo koja lista može biti ugniježđena u drugu. Unutar elementaPrimjer: Ugniježđene liste
Formatiranje lista sa nabrajanjem
Za promjenu izgled markeri liste bi trebali koristiti svojstvo tip-stil liste css stilovi:
Sljedeći primjer pokazuje različite stilove za liste s nabrajanjem:
Primjer: Stilovi liste s nabrajanjem
disk:
krug:
Kvadrat:
ništa:
Grafički markeri.
U HTML-u je moguće kreirati listu sa grafičkim markerima. Jedno je kada su markeri liste standardni krugovi ili kvadrati, a sasvim drugo kada programer sam bira marker u skladu sa dizajnom stranice. Kako bi stavke na listi izgledale lijepo, često se koriste male slike.
Za zamjenu običnog markera grafičkim, zamijenite svojstvo tip-stil liste po nekretnini slika u stilu liste i navedite URL slike:Primjer: Grafički markeri
Znakovi zodijaka
Znakovi zodijaka
Liste definicija (opisa)
Liste definicija su vrlo zgodne za kreiranje, na primjer, vašeg ličnog rječnika pojmova. Svaka stavka na listi definicija ima dva dijela: pojam i njegovu definiciju.
Stavljate cijelu listu u element
Liste definicija se često koriste u naučnim, tehničkim i obrazovnim publikacijama, uz njihovu pomoć prave pojmovnike, rječnike, priručnike itd.Opća struktura liste opisa je sljedeća:
Sljedeći primjer pokazuje jednu od moguće upotrebe lista definicija:
Primjer: Lista definicija
World Wide Web - sa engleskog. World Wide Web (WWW) je distribuirani sistem koji omogućava pristup međusobno povezanim dokumentima koji se nalaze na različitim računarima povezanim na Internet. Internet je skup mreža koje koriste jedan protokol razmjene za prijenos informacija. Stranica je skup pojedinačnih web stranica koje su povezane linkovima i imaju zajednički dizajn.
Podrazumevano, tekst pojma je smešten na levoj ivici prozora pretraživača, a opis pojma se nalazi ispod i pomera se udesno.
Numerisane liste su skup elemenata sa njihovim serijskim brojevima. Vrsta i tip numeracije zavise od atributa oznake
- , koji se koristi za kreiranje liste. Svaka stavka u numerisanoj listi je identifikovana oznakom
Ovdje: upišite - znakove liste:
Ako želite da lista počinje brojem koji nije 1, morate to navesti koristeći atribut start tag
Sljedeći primjer prikazuje numerisanu listu sa velikim rimskim brojevima i početna vrijednost XLIX:Numerisanje se također može započeti korištenjem atributa vrijednost, koji se dodaje elementu
Primjer snimanja:
- .
- .
Takva notacija određuje numeraciju liste od velikog latiničnog slova "E". Za ostale tipove numeracije, unos START=5 će postaviti numeraciju, odnosno od broja "5", rimskog broja "V" itd.
Promjena tipa numeracije liste i vrijednosti brojeva može se izvršiti i za bilo koji element liste. Tag
- za numerisane liste, dozvoljava upotrebu parametara TYPE i VALUE. Parametar TYPE može imati iste vrijednosti kao i za oznaku
Parametar COMPACT ima isto značenje kao i liste za nabrajanje. Parametar TYPE se koristi za određivanje načina na koji je lista numerisana. Može poprimiti sljedeće vrijednosti:
TYPE = A - postavlja markere u obliku velikih latiničnih slova;
TYPE = a - postavlja markere u obliku malih latiničnih slova;
TIP = I - postavlja markere u obliku velikih rimskih brojeva;
TYPE = i - postavlja markere u obliku malih rimskih brojeva;
TYPE = 1 - postavlja markere u obliku arapskih brojeva.
Podrazumevano se uvijek koristi vrijednost TYPE = 1, odnosno numeracija arapskim brojevima. Ovo se također odnosi na ugniježđene uređene liste. Ovdje, za razliku od lista sa nabrajanjem, pretraživači po defaultu ne prave različite numeracije na različitim nivoima ugniježđenja lista. Imajte na umu da se iza broja elementa liste uvijek dodatno prikazuje znak "tačka".
Parametar TYPE sa istim vrijednostima može se koristiti za određivanje kako pojedinačni elementi liste trebaju biti numerirani. Da biste to učinili, dozvoljeno je navesti parametar TYPE s odgovarajućom vrijednošću u oznaci elementa liste
Liste ovog tipa su obično uređeni niz pojedinačnih elemenata. Razlika od lista sa nabrajanjem je u tome što u numerisanoj listi svakom elementu automatski prethodi serijski broj. Tip numeracije zavisi od pretraživača i može se podesiti parametrima liste oznaka. Inače, implementacija numerisanih lista je veoma slična implementaciji lista sa nabrajanjem.
oznake
- I
Da biste kreirali numerisanu listu, trebalo bi da koristite oznaku kontejnera unutar koje se nalaze svi elementi liste. Oznake za otvaranje i zatvaranje liste obezbeđuju prelom reda pre i posle liste, odvajajući tako listu od glavnog sadržaja dokumenta.
Kao i kod liste za nabrajanje, svaka stavka u listi sa nabrajanjem mora početi oznakom
Evo primjera HTML dokumenta koji koristi listu definicija:
Primjer liste definicija Klasifikacija tipičnih ljudskih temperamenata,
osnovano stavovima Hipokrata
Prikaz datog HTML dokumenta u pretraživaču je prikazan na Sl. 2.5.
Rice. 2.5. Lista definicija (podsjeća na grupu unosa u rječniku)
Upišite liste
I - .
U početku su liste ovih tipova zamišljene kao kompaktnije od konvencionalnih lista sa nabrajanjem. Prema pravilima za pisanje elemenata ovih lista, nije im bilo dozvoljeno da koriste blok elemente, što znači da je nemoguće implementirati ugniježđenje lista ovog tipa. Svaki element liste bio je jedan red teksta.
Za liste poput
planirano je da se uvede ograničenje na „dužinu teksta elementa liste (24 karaktera). Takvo ograničenje bi omogućilo liste tipova
u obliku sličnom popisu direktorija u operativni sistemi UNIX i MS-DOS kada koristite prekidač /W (u više kolona). Osim toga, za stavke liste ovog tipa nisu prikazani meci. Trenutno sve ove ideje nisu realizovane, jer se dalje korišćenje lista ovih vrsta ne preporučuje. Moderne verzije pretraživača prikazuju liste ovih tipova na potpuno isti način kao i liste tog tipa
- .
Ugniježđene liste
Postoje slučajevi kada element liste jednog tipa treba da uključi čitavu listu istog ili drugog tipa. Ovo će organizirati višeslojne ili ugniježđene liste. HTML dozvoljava proizvoljno ugniježđenje različitih tipova lista, ali se mora voditi računa kada ih organizirate.
Ispod je HTML kod dokumenta sa ugniježđenim listama, čiji je prikaz prikazan na Sl. 2.6. U ovom primeru, svaki element liste sa nabrajanjem ima svoju numerisanu listu.
Primjer ugniježđene liste Sateliti nekih planeta
- , elementi na nivou bloka mogu se postaviti. Iz toga posebno slijedi da se liste definicija mogu ugniježditi.
-
P primjer snimka:
- .
- .
Takva notacija određuje numeraciju liste od velikog latiničnog slova "E". Za ostale tipove numeracije, unos START=5 će postaviti numeraciju, odnosno od broja "5", rimskog broja "V" itd.
Promjena tipa numeracije liste i vrijednosti brojeva može se izvršiti i za bilo koji element liste. Tag
- za numerisane liste, dozvoljava upotrebu parametara TYPE i VALUE. Parametar TYPE može imati iste vrijednosti kao i za oznaku
Parametar COMPACT ima isto značenje kao i liste za nabrajanje. Parametar TYPE se koristi za određivanje načina na koji je lista numerisana. Može poprimiti sljedeće vrijednosti:
TYPE = A - postavlja markere u obliku velikih latiničnih slova;
TYPE = a - postavlja markere u obliku malih latiničnih slova;
TIP = I - postavlja markere u obliku velikih rimskih brojeva;
TYPE = i - postavlja markere u obliku malih rimskih brojeva;
TYPE = 1 - postavlja markere u obliku arapskih brojeva.
Podrazumevano se uvijek koristi vrijednost TYPE = 1, odnosno numeracija arapskim brojevima. Ovo se također odnosi na ugniježđene uređene liste. Ovdje, za razliku od lista sa nabrajanjem, pretraživači po defaultu ne prave različite numeracije na različitim nivoima ugniježđenja lista. Imajte na umu da se iza broja elementa liste uvijek dodatno prikazuje znak "tačka".
Parametar TYPE sa istim vrijednostima može se koristiti za određivanje kako pojedinačni elementi liste trebaju biti numerirani. Da biste to učinili, dozvoljeno je navesti parametar TYPE s odgovarajućom vrijednošću u oznaci elementa liste
Liste ovog tipa obično predstavljaju uređeni niz pojedinačnih elemenata. Razlika od lista sa nabrajanjem je u tome što u numerisanoj listi svakom elementu automatski prethodi serijski broj. Tip numeracije zavisi od pretraživača i može se podesiti parametrima oznaka liste. Inače, implementacija numerisanih lista je veoma slična implementaciji lista sa nabrajanjem.
Oznake
- I
Da biste kreirali numerisanu listu, trebalo bi da koristite oznaku kontejnera unutar koje se nalaze svi elementi liste. Oznake za otvaranje i zatvaranje liste obezbeđuju prelom reda ispred i posle liste, odvajajući tako listu od glavnog sadržaja dokumenta.
Kao i kod liste za nabrajanje, svaka stavka u listi sa nabrajanjem mora početi oznakom
- Pokazivanje na pojedinačne stavke liste daje standardne markere stavki liste.
Parametar COMPACT se piše bez vrijednosti i koristi se da naznači pretraživaču da datu listu treba prikazati u kompaktnom obliku. Na primjer, font ili razmak između redova liste može se smanjiti, itd.
Bilješka
Trenutno, prisustvo parametra COMPACT u oznaci
- ne utiče na prikaz lista od strane vodećih pretraživača. Stoga je korištenje ovog parametra besmisleno, pogotovo jer njegovu upotrebu ne preporučuje HTML 4.0 specifikacija.
Parametar TYPE može imati sljedeće vrijednosti: disk, krug i kvadrat. Ovaj parametar se koristi za prisilno pojavljivanje markera liste. Tačan izgled markera zavisiće od pretraživača koji koristite. Tipične opcije prikaza su sljedeće:
TIP = disk - markeri se prikazuju kao puni krugovi; TIP = krug - markeri se prikazuju kao nepopunjeni krugovi; TIP = kvadrat - markeri se prikazuju kao popunjeni kvadrati. Primjer snimanja:
-
.
Zadana vrijednost je TYPE = disk. Za ugniježđene liste sa nabrajanjem, zadana vrijednost je disk na prvom nivou, krug na drugom nivou i kvadrat na trećem nivou. To je upravo ono što se radi u najnovije verzije Netscape pretraživači i Internet Explorer. Imajte na umu da drugi pretraživači mogu drugačije prikazati markere. Na primjer, u HTML 4.0 specifikaciji, tip markera koji se prikazuje kada je TYPE = square specificiran je kao obris kvadrata.
Parametar TYPE sa istim vrijednostima može se koristiti za određivanje tipa markera za pojedinačne stavke liste. Da biste to učinili, dozvoljeno je navesti parametar TYPE s odgovarajućom vrijednošću u oznaci elementa liste
- .
- ,
- ,
- , uz pomoć kojih se liste ovog tipa organizuju u HTML dokumente (UL - Unordered List, unordered list).
U listi za nabrajanje, da bi se istakli njeni elementi, koriste se posebni znakovi, koji se nazivaju markeri liste (često se nazivaju bullets, što je formalno zvučanje engleskog izraza bullet). Izgled markera liste određuje pretraživač, a prilikom kreiranja ugniježđenih lista pretraživači automatski diverzificiraju izgled markera različitih nivoa ugniježđenja.
Oznake I<LI >
Da biste kreirali listu sa nabrajanjem, morate koristiti tag-container, unutar kojeg se nalaze svi elementi liste. Oznake za otvaranje i zatvaranje liste obezbeđuju prelom reda ispred i posle liste, odvajajući tako listu od glavnog sadržaja dokumenta, tako da nema potrebe da se ovde koriste oznake pasusa.
.
Svaka stavka liste mora početi oznakom