Demo 5 - Kalatori: hinnasto

Kalatori-sivuston toisena osana toteutetaan "hinnasto"-osio
Lisää kalatori-sivuston kansioon hinnasto.html ja hinnasto.css
Linkitä hinnasto.css ja common.css

html_css_basics | ├── demos | | │ └── d5_kalatori | | │ ├── hinnasto.html │ ├── hinnasto.css │ ├── markkinat.html │ ├── markkinat.css │ ├── header.html │ ├── header.css │ ├── common.css | | │ └─── img │ │ ├── kuva_1.jpg │ │ └── kuva_2.jpg |

Tehtävä

Tee HTML section-elementti, jonka id on hinnasto
Lisää otsikko Hinnasto
Lataa pöytäkarttakuva torista ja lisää se sivulle.
Lisää kuvateksti (Myyntipöydät on aseteltu kahteen riviin).
Tee taulukko, jossa on pöytien tunnukset, pinta-alat, hinnat ja pöytien varaustilanne.
Asemoi elementit vierekkäin siten, että pöytäkartta vie 2/3 osion leveydestä ja taulukko 1/3 osan.
Muotoile taulukkoa: Lisää riveittäin vaihtelevat taustavärit ja väritä varatut rivit punaisella lisäämällä niihin esim. class="reserved", johon toteutat punaisen taustavärin.
Tallenna muutokset Gittiin

Tunnus Ala m² Hinta € Varaus A1 15 60 VAPAA A2 15 60 VAPAA A3 15 60 VAPAA A4 15 60 VAPAA A5 15 60 VAPAA B1 8 40 VAPAA B1 8 40 VAPAA B2 8 40 VARATTU B3 8 40 VARATTU B4 8 40 VARATTU B5 8 40 VARATTU B6 8 40 VAPAA B7 8 40 VAPAA B8 8 40 VAPAA B9 8 40 VAPAA B10 8 40 VAPAA

Valmis osio:

Kuva torista: