5. Tehtävä - Listat

Usein asioiden esittäminen on helpointa järkeistää tekemällä niistä lista. Tyypillisimmät listat ovat järjestetyt numeroidut listat <ol> (Engl. Ordered list) , jossa listan jokaiselle riville tulee rivin alkuun numero osoittamaan lista-alkioiden <li> määrää, eli sitä monesko rivi listalla on menossa ja järjestämättömät listat <ul> (Engl. unordered list), joissa lista-alkiot erotetaan ainoastaan pienellä mustalla pisteellä rivin alussa.

Myös muita listatyyppejä on olemassa, mutta niitä emme käy tässä läpi.
Jokainen lista-alkio avataan ja suljetaan varsinaisen listan (tässä tapauksessa <ul> tai <ol>) sisällä.

Esimerkki: Kauppalista
Kauppalistan tekeminen on html:llä erittäin helppoa.
Ensimmäinen toiminto on listatyypin valitseminen. Kauppalistassa ei tuotteiden järjestyksellä ole merkitystä, joten käytämme järjestelemätöntä listaa, jonka sisälle listaamme tuotteet.

<ul>
    <li> Maitoa</li>
    <li> Leipää</li>
    <li> Juustoa</li>
    <li> Makkaraa</li>
    <li> ES:ää</li>
</ul>

Lista tulostaa:

  • Maitoa
  • Leipää
  • Juustoa
  • Makkaraa
  • ES:ää

Tehtävä: 
Lisää uudelle sivullesi lista valitsemastasi asiasta (vaikka viisi parasta peliä kautta aikain). 
Listassa tulee olla vähintään viisi listaelementtiä. 
Comments