## Tavoite
Esittele työntekijätiedot jäsennellyssä taulukkomuodossa käyttämällä sopivia HTML-tageja rivien ja sarakkeiden luomiseen.

## Tehtävä
Luo taulukko, jossa on kolme saraketta: **Nimi**, **Tehtävä** ja **Palkka**. Keskity käyttämään sopivia HTML-tageja täyttääksesi taulukon oikeilla riveillä ja sarakkeilla.
Tässä on tiedot, jotka tulee sisällyttää:
1. Nimi: **Emma Johnson** | Tehtävä: **Myyntiedustaja** | Palkka: **$15.50 per hour**.
2. Nimi: **Liam Thompson** | Tehtävä: **Asiakaspalveluedustaja** | Palkka: **$14.75 per hour**.
3. Nimi: **Olivia Rodriguez** | Tehtävä: **Markkinointikoordinaattori** | Palkka: **$18.25 per hour**.
4. Nimi: **Noah Smith** | Tehtävä: **IT-tukihenkilö** | Palkka: **$20.00 per hour**.
5. Nimi: **Ava Davis** | Tehtävä: **Hallinnollinen avustaja** | Palkka: **$16.80 per hour**.


PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxsaW5rIHJlbD0ic3R5bGVzaGVldCIgaHJlZj0iaW5kZXguY3NzIiAvPgogIDwvaGVhZD4KICA8Ym9keT4KICAgIDx0YWJsZT4KICAgICAgPCEtLSBUYWJsZSBoZWFkZXI6IERlZmluZXMgdGhlIGNvbHVtbiBoZWFkaW5ncyAtLT4KICAgICAgPHRoZWFkPgogICAgICAgIDx0cj4KICAgICAgICAgIDx0aD5fX188L3RoPgogICAgICAgICAgPHRoPlBvc2l0aW9uPC90aD4KICAgICAgICAgIDxfX18+V2FnZTwvX19fPgogICAgICAgIDwvdHI+CiAgICAgIDwvdGhlYWQ+CgogICAgICA8IS0tIFRhYmxlIGJvZHk6IENvbnRhaW5zIGRhdGEgZm9yIGVhY2ggZW1wbG95ZWUgLS0+CiAgICAgIDx0Ym9keT4KICAgICAgICA8IS0tIFJvdyAxIC0tPgogICAgICAgIDx0cj4KICAgICAgICAgIDx0ZD5FbW1hIEpvaG5zb248L3RkPgogICAgICAgICAgPHRkPl9fXzwvdGQ+CiAgICAgICAgICA8dGQ+JDE1LjUwIHBlciBob3VyPC90ZD4KICAgICAgICA8L3RyPgogICAgICAgIDwhLS0gUm93IDIgLS0+CiAgICAgICAgPHRyPgogICAgICAgICAgPF9fXz5MaWFtIFRob21wc29uPC9fX18+CiAgICAgICAgICA8dGQ+Q3VzdG9tZXIgU2VydmljZSBSZXByZXNlbnRhdGl2ZTwvdGQ+CiAgICAgICAgICA8dGQ+JDE0Ljc1IHBlciBob3VyPC90ZD4KICAgICAgICA8L3RyPgogICAgICAgIDwhLS0gUm93IDMgLS0+CiAgICAgICAgPF9fXz4KICAgICAgICAgIDx0ZD5PbGl2aWEgUm9kcmlndWV6PC90ZD4KICAgICAgICAgIDx0ZD5NYXJrZXRpbmcgQ29vcmRpbmF0b3I8L3RkPgogICAgICAgICAgPHRkPiQxOC4yNSBwZXIgaG91cjwvdGQ+CiAgICAgICAgPC9fX18+CiAgICAgICAgPCEtLSBSb3cgNCAtLT4KICAgICAgICA8dHI+CiAgICAgICAgICA8dGQ+Tm9haCBTbWl0aDwvdGQ+CiAgICAgICAgICA8dGQ+SVQgU3VwcG9ydCBTcGVjaWFsaXN0PC90ZD4KICAgICAgICAgIF9fXwogICAgICAgIDwvdHI+CiAgICAgICAgPCEtLSBSb3cgNSAtLT4KICAgICAgICA8dHI+CiAgICAgICAgICA8dGQ+QXZhIERhdmlzPC90ZD4KICAgICAgICAgIF9fXwogICAgICAgICAgPHRkPiQxNi44MCBwZXIgaG91cjwvdGQ+CiAgICAgICAgPC90cj4KICAgICAgPC90Ym9keT4KICAgIDwvdGFibGU+CiAgPC9ib2R5Pgo8L2h0bWw+

LyogCiAgV2UgY29sbGFwc2UgdGhlIGJvcmRlcnMgb2YgZWFjaCBjZWxsLiAKICBCeSBkZWZhdWx0LCBlYWNoIGNlbGwgaGFzIGl0cyBvd24gYm9yZGVycyAKICB3aGljaCBhcmUgbm90IGNvbm5lY3RlZC4KKi8KdGFibGUgewogIGJvcmRlci1jb2xsYXBzZTogY29sbGFwc2U7CiAgbWFyZ2luOiAwIGF1dG87CiAgbWFyZ2luLXRvcDogMzBweDsKICBmb250LWZhbWlseTogQXJpYWwsIHNhbnMtc2VyaWY7Cn0KCi8qIAogIEFkZCBhIGJvcmRlciBhbmQgcGFkZGluZyB0byB0aGUgY2VsbHMsIAogIHRoZSBkaXN0YW5jZSBmcm9tIHRoZSBjb250ZW50IHRvIHRoZSBib3JkZXIuCiovCnRhYmxlIHRoLAp0YWJsZSB0ZCB7CiAgcGFkZGluZzogMTBweDsKICBib3JkZXI6IDNweCBzb2xpZCAjZmY4YTAwOwogIHRleHQtYWxpZ246IGNlbnRlcjsKfQoKLyogU3R5bGUgZm9yIHRhYmxlIGhlYWRlciByb3cgKi8KdGhlYWQgdGggewogIGJhY2tncm91bmQtY29sb3I6ICNmMmYyZjI7CiAgZm9udC13ZWlnaHQ6IGJvbGQ7CiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTsKfQoKLyogQWx0ZXJuYXRlIHJvdyBiYWNrZ3JvdW5kIGNvbG9yICovCnRib2R5IHRyOm50aC1jaGlsZChldmVuKSB7CiAgYmFja2dyb3VuZC1jb2xvcjogI2YyZjJmMjsKfQoKLyogSG92ZXIgZWZmZWN0IG9uIHRhYmxlIHJvd3MgKi8KdGJvZHkgdHI6aG92ZXIgewogIGJhY2tncm91bmQtY29sb3I6ICNmZmQ2OTk7Cn0KCi8qIFRleHQgc3R5bGluZyBmb3IgY2VsbHMgKi8KdGFibGUgdGggewogIGZvbnQtc2l6ZTogMTZweDsKICBjb2xvcjogIzMzMzsKfQoKdGFibGUgdGQgewogIGZvbnQtc2l6ZTogMTRweDsKICBjb2xvcjogIzU1NTsKfQoKLyogRW1waGFzaXplIHdhZ2UgKi8KdGFibGUgdGQ6bnRoLWNoaWxkKDMpIHsKICBmb250LXdlaWdodDogYm9sZDsKICBjb2xvcjogI2ZmOGEwMDsKfQ==

1. Käytä `table`-tagia määrittääksesi taulukon pääsäiliöelementin.
2. Käytä `thead`-tagia ryhmitelläksesi taulukon otsikkosisällön, kuten sarakeotsikot.
3. Käytä `tr`-tagia määrittääksesi uuden rivin taulukossa.
4. Käytä `th`-tagia määrittääksesi kunkin sarakkeen otsikkotekstin.
5. Käytä `tbody`-tagia ryhmitelläksesi taulukon pääsisällön, joka sisältää rivit ja datakentät.
6. Käytä `td`-tagia määrittääksesi varsinaisen datan tai sisällön kussakin taulukon solussa.

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxsaW5rIHJlbD0ic3R5bGVzaGVldCIgaHJlZj0iaW5kZXguY3NzIiAvPgogIDwvaGVhZD4KICA8Ym9keT4KICAgIDx0YWJsZT4KICAgICAgPCEtLSBUYWJsZSBoZWFkZXI6IERlZmluZXMgdGhlIGNvbHVtbiBoZWFkaW5ncyAtLT4KICAgICAgPHRoZWFkPgogICAgICAgIDx0cj4KICAgICAgICAgIDx0aD5OYW1lPC90aD4KICAgICAgICAgIDx0aD5Qb3NpdGlvbjwvdGg+CiAgICAgICAgICA8dGg+V2FnZTwvdGg+CiAgICAgICAgPC90cj4KICAgICAgPC90aGVhZD4KCiAgICAgIDwhLS0gVGFibGUgYm9keTogQ29udGFpbnMgZGF0YSBmb3IgZWFjaCBlbXBsb3llZSAtLT4KICAgICAgPHRib2R5PgogICAgICAgIDwhLS0gUm93IDEgLS0+CiAgICAgICAgPHRyPgogICAgICAgICAgPHRkPkVtbWEgSm9obnNvbjwvdGQ+CiAgICAgICAgICA8dGQ+U2FsZXMgQXNzb2NpYXRlPC90ZD4KICAgICAgICAgIDx0ZD4kMTUuNTAgcGVyIGhvdXI8L3RkPgogICAgICAgIDwvdHI+CiAgICAgICAgPCEtLSBSb3cgMiAtLT4KICAgICAgICA8dHI+CiAgICAgICAgICA8dGQ+TGlhbSBUaG9tcHNvbjwvdGQ+CiAgICAgICAgICA8dGQ+Q3VzdG9tZXIgU2VydmljZSBSZXByZXNlbnRhdGl2ZTwvdGQ+CiAgICAgICAgICA8dGQ+JDE0Ljc1IHBlciBob3VyPC90ZD4KICAgICAgICA8L3RyPgogICAgICAgIDwhLS0gUm93IDMgLS0+CiAgICAgICAgPHRyPgogICAgICAgICAgPHRkPk9saXZpYSBSb2RyaWd1ZXo8L3RkPgogICAgICAgICAgPHRkPk1hcmtldGluZyBDb29yZGluYXRvcjwvdGQ+CiAgICAgICAgICA8dGQ+JDE4LjI1IHBlciBob3VyPC90ZD4KICAgICAgICA8L3RyPgogICAgICAgIDwhLS0gUm93IDQgLS0+CiAgICAgICAgPHRyPgogICAgICAgICAgPHRkPk5vYWggU21pdGg8L3RkPgogICAgICAgICAgPHRkPklUIFN1cHBvcnQgU3BlY2lhbGlzdDwvdGQ+CiAgICAgICAgICA8dGQ+JDIwLjAwIHBlciBob3VyPC90ZD4KICAgICAgICA8L3RyPgogICAgICAgIDwhLS0gUm93IDUgLS0+CiAgICAgICAgPHRyPgogICAgICAgICAgPHRkPkF2YSBEYXZpczwvdGQ+CiAgICAgICAgICA8dGQ+QWRtaW5pc3RyYXRpdmUgQXNzaXN0YW50PC90ZD4KICAgICAgICAgIDx0ZD4kMTYuODAgcGVyIGhvdXI8L3RkPgogICAgICAgIDwvdHI+CiAgICAgIDwvdGJvZHk+CiAgICA8L3RhYmxlPgogIDwvYm9keT4KPC9odG1sPg==

Opi HTML:n (HyperText Markup Language) perusteet, joka on verkkokehityksen perusta. Tämä aloittelijaystävällinen kurssi kattaa tunnisteet, attribuutit, elementit ja verkkosivujen rakenteen. Hanki käytännön taitoja otsikoiden, kappaleiden, listojen, kuvien, linkkien, lomakkeiden ja taulukoiden luomisessa. Tutustu parhaisiin käytäntöihin, optimointiin ja verkkosivustojen saavutettavuuteen. Aloita verkkokehityksen matkasi HTML:n avulla.

Tutki verkon sisäistä toimintaa. Opi, miten data kulkee verkkojen läpi, tutustu protokollien rooliin ja selvitä IP-osoitteiden ja verkkotunnusten mysteerit. Saa korkeatasoinen ymmärrys siitä, miten verkkoselaimet ja palvelimet kommunikoivat toimittaakseen verkkosisältöä.

Tutustu tunnisteiden voimaan sisällön jäsentämisessä, otsikoista ja kappaleista listoihin ja taulukoihin. Opi, kuinka voit parantaa elementtejä attribuuteilla.

HTML-dokumentin rakenteen ydin. Opi HTML-dokumentin osat, mukaan lukien doctype-ilmoitus, head ja body. Ymmärrä kunkin elementin tarkoitus ja miten ne vaikuttavat verkkosivun kokonaisrakenteeseen.

Tee verkkosivusta houkuttelevampi median, kuten kuvien, äänen ja videon avulla. Työskentele jäsennellyn taulukkomuotoisen datan kanssa taulukoiden muodossa.

Tutustu HTML-lomakkeiden monipuolisuuteen. Opi suunnittelemaan intuitiivisia ja käyttäjäystävällisiä lomakkeita hyödyntämällä keskeisiä käsitteitä ja tekniikoita. Selvitä, kuinka lomakkeet mahdollistavat käyttäjän vuorovaikutuksen ja tietojen lähettämisen verkkosivustoilla.

Haaste: Suunnittele Toimiva HTML-taulukko

Tavoite

Tehtävä

Awesome!

Haaste: Suunnittele Toimiva HTML-taulukko

Tavoite

Tehtävä