Saraksti

Šis apraksts ir paredzēts tikai kā vispārīgs apskats. Tas neaptver visu HTML un CSS iespēju uzskaitījumu. Šeit var būt iekļauti arī novecojoši piemēri.

Sākumlapa Iepriekšējā lappuse Nākošā lappuse


Numurētie saraksti
Bumbiņsaraksti
Saraksti bez izceltām rindām
Saraksts ar paskaidrojumiem
Daudzpakāpju saraksti
Vienkārši izveidojami saraksti

Sarakstu veidošanai ir paredzētas šādas komandas: <UL>, <OL> un <DL> ar atbilstošām noslēdzošām komandām: </UL>, </OL> un </DL>. Pēc būtības šīs sarakstu veidošanas komandas ir rindkopu stili. Izmantojot stilu lapas, ir iespējams noteikt šo stilu izskatu, ieskatot atkāpi no malām un attālumu starp rindiņām.

Numurētie saraksti

Numurētos sarakstus sāk ar komandu <OL>. Noslēdzošā komanda </OL> ir nepieciešama.

Saraksta katru rindiņu sāk ar <LI>. Atbilstošās noslēdzošā komanda ir vēlama.

Piemērs

<OL> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </OL>

Rezultāts:

  1. Pirmā rindiņa
  2. Otrā rindiņa
  3. Trešā rindiņa

Numerāciju ir iespējam aizstāt ar burtiem vai romiešu cipariem izmantojot iestādni type. Iespējamās vērtības apkopotas tabulā:

type vērtībanumerācijas veids
1arābu skaitļi1, 2, 3, ...
amazie burtia, b, c, ...
Alielie burtiA, B, C, ...
imazie romiešu skaitļii, ii, iii, ...
Ilielie romiešu skaitļiI, II, III, ...

Piemērs

<OL type=i> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </OL>

Rezultāts:

  1. Pirmā rindiņa
  2. Otrā rindiņa
  3. Trešā rindiņa

Izmantojot komandas <OL> iestādni start, var uzdot sākuma skaitli. Lai arī sākuma skaitlis ir vesels skaitlis, saraksta rindu numerācija atbildīs iestādnei type.

Piemērs

<OL type=I start=13> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </OL>

Rezultāts:

  1. Pirmā rindiņa
  2. Otrā rindiņa
  3. Trešā rindiņa

Katrai izceltai rindiņai var uzrādīt savu numuru izmantojot komandas <LI> parametru value

Piemērs

<OL> <LI value=100>Pirmā rindiņa</LI> <LI value=200>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </OL>

Rezultāts:

  1. Pirmā rindiņa
  2. Otrā rindiņa
  3. Trešā rindiņa
Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

Bumbiņsaraksti

Bumbiņsarakstus sāk ar komandu <UL>. Noslēdzošā komanda </UL> ir nepieciešama. Saraksta katru rindiņu sāk ar komandu <LI>. Atbilstošās noslēdzošā komanda ir vēlama.

Piemērs

<UL> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </UL>

Rezultāts:

Veidojot sarakstus, „bumbiņu” iespējams aizstat ar attēlu. Šim nolūkam jāizveido atbilstoša stila klase.

Piemērs

<style> .izbriins { list-style-image: url(att/sveikini.ani.gif); } </style> <UL class=izbriins> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </UL>

Rezultāts:

Ja stilā uzrādītais attēls nav atrodams, tad saraksts tiek parādīts kā parasts bumbiņsaraksts.

Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

Saraksti bez izceltām rindām

Sarakstus, kuros nav īpaši izceltas rindas, var veidot ar komandu <BLOCKQUOTE>. Noslēdzošā komanda </BLOCKQUOTE> ir nepieciešama. Saraksta pirmai rindiņai neliek priekša nekādu komandu, bet katru nākamo rindiņu sāk ar pārlauzuma komandu <BR>. Atbilstošās noslēdzošās komandas nav.

Piemērs

Teksts pirms saraksta. <BLOCKQUOTE> Pirmā rindiņa <BR>Otrā rindiņa <BR>Trešā rindiņa </BLOCKQUOTE> Teksts aiz saraksta.

Rezultāts:

Teksts pirms saraksta.
Pirmā rindiņa
Otrā rindiņa
Trešā rindiņa
Teksts aiz saraksta.

Ērtāk un vienkāršāk ir izmantot stilus. Tad, ja nepieciešams pārmainīt saraksta izskatu, pietiek ar izmantotās klases pielabošanu.

Piemērs

<style> .nekaads { list-style: none; } </style> Teksts pirms saraksta. <UL class=nekaads> <LI>Pirmā rindiņa</LI> <LI>Otrā rindiņa</LI> <LI>Trešā rindiņa</LI> </UL> Teksts aiz saraksta.

Rezultāts:

Teksts pirms saraksta. Teksts aiz saraksta.
Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

Saraksts ar paskaidrojumiem

Sarakstus ar paskaidrojumiem sāk ar komandu <DL>. Noslēdzošā komanda </DL> ir nepieciešama. Saraksta katru rindiņu sāk ar komandu <DT>. Noslēdzošā komanda ir vēlama un to labāk likt aiz paskaidrojuma beigām. Katru paskaidrojuma rindiņu sāk ar komandu <DD>. Atbilstošās noslēdzošā komanda ir vēlama.

Piemērs

<DL> <DT>Pirmā rindiņa</DT> <DT>Otrā rindiņa <DD>Paskaidrojums otrajai rindiņai</DD> </DT> <DT>Trešā rindiņa</DT> </DL>

Rezultāts:

Pirmā rindiņa
Otrā rindiņa
Paskaidrojums otrajai rindiņai
Trešā rindiņa
Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

Daudzpakāpju saraksti

Sarakstus iespējams iekļaut vienu otrā, tādejādi veidojot daudzpakāpju sarakstus.

Piemērs

<OL type=A> <li>Pirmā rindiņa <OL> <li>Pirmā-pirmā rindiņa</li> <li>Pirmā-otrā rindiņa</li> </OL> </li> <li>Otrā rindiņa <UL> <li>Otrā-pirmā rindiņa</li> <li>Otrā-otrā rindiņa</li> </UL> </li> <li>Trešā rindiņa</li> </OL>

Rezultāts:

  1. Pirmā rindiņa
    1. Pirmā-pirmā rindiņa
    2. Pirmā-otrā rindiņa
  2. Otrā rindiņa
    • Otrā-pirmā rindiņa
    • Otrā-otrā rindiņa
  3. Trešā rindiņa

Ar stiliem iespējams noteikt katram līmenim savu simbolu, tai skaitā var ieslēgt rindu numurēšanu. Numerācija strādās arī tad, ja tiek izmantots „bumbiņsaraksts”.

Piemērs

<style> .biol { list-style-image: url(att/puke.gif); } .biol ul { list-style-image: url(att/beka.gif); } .biol ul ul{ list-style-image: url(att/gliemezis.gif); } .biol ul ul ul{ list-style: decimal; } </style> <ul class=biol> <li>Pirmā rindiņa.</li> <ul> <li>Pirmā—pirmā rindiņa. <li>Otrā—pirmā rindiņa. </ul> <li>Otrā rindiņa</li> <ul> <li>pirmā—otrā rindiņa. <li>Otrā—otrā rindiņa. <ul> <li>Pirmā—otrā—otrā rindiņa. <ul> <li>Pirmā—pirmā—otrā—otrā rindiņa. <li>Otrā—pirmā—otrā—otrā rindiņa. <li>Trešā—pirmā—otrā—otrā rindiņa. <li>Ceturtā—pirmā—otrā—otrā rindiņa. </ul> </ul> </ul> <li>Trešā rindiņa</li> </ul>

Rezultāts:

Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

Vienkārši izveidojami saraksti

Sarakstus iespējams izveidot kā vienkāršu tekstu izmantojot tam paredzētos formatējumu – atstarpes, tabulatorus un pārejas uz jaunu rindiņu. Lai parādītu šādus sarakstus var izmantot komandu <PRE>. Tādā gadījumā teksta attēlošanai tiek izmantots viena platuma fonts, tas ir, tāds fonts, kuram visi simboli aizņem vienādu platumu, tai skaitā burti „i” un „m”.

Piemērs

<PRE> 1. Saraksta pirmais ieraksts, kurš aizņem divas rindiņas. 1.1. Saraksta pirmais ieraksts ar atkāpi. 1.2. Saraksta otrais ieraksts ar atkāpi. 1.3. Saraksta trešais ieraksts ar atkāpi. 2. Otrais lielais ieraksts. </PRE>

Rezultāts:

1. Saraksta pirmais ieraksts,
   kurš aizņem divas rindiņas.
   
	1.1. Saraksta pirmais ieraksts ar atkāpi.
	1.2. Saraksta otrais ieraksts ar atkāpi.
	1.3. Saraksta trešais ieraksts ar atkāpi.

2. Otrais lielais ieraksts.

Ja vajag, lai tekstā tiktu izmantoti proporcionāls fonts, tas ir, tāds fonts, kurā katram simbolam var būt savs platums, piemēram, burts „i” ir krietni šaurāks par „m”, tad jāizmanto sadaļa, kurai piešķirts stils ar atbilstošu parametra vērtību (white-space: pre-wrap;).

Piemērs

<DIV style='white-space: pre-wrap;'> 1. Saraksta pirmais ieraksts, kurš aizņem divas rindiņas. 1.1. Saraksta pirmais ieraksts ar atkāpi. 1.2. Saraksta otrais ieraksts ar atkāpi. 1.3. Saraksta trešais ieraksts ar atkāpi. 2. Otrais lielais ieraksts. </DIV>

Rezultāts:

1. Saraksta pirmais ieraksts, kurš aizņem divas rindiņas. 1.1. Saraksta pirmais ieraksts ar atkāpi. 1.2. Saraksta otrais ieraksts ar atkāpi. 1.3. Saraksta trešais ieraksts ar atkāpi. 2. Otrais lielais ieraksts.
Saturs Iepriekšējā lappuse Lappas saturs Nākošā lappuse

priede.bf.lu.lv Bioloģijas fakultāte Datorklase Sākumlapa
Pamatlapa BF Padomi Sākums

Lappuse labota: 2026.08.17
Lapa ir publicēta ar    CC    BY–SA    4.0 licenci. Ja lapā ir ietvertas daļas uz kurām attiecas cita licence, tas norādīts atsevišķi lapas tekstā.