## Mål
Presentera information om anställda i ett strukturerat tabellformat genom att använda lämpliga HTML-taggar för att skapa rader och kolumner.

## Uppgift
Skapa en tabell med tre kolumner: **Name**, **Position** och **Wage**. Fokusera på att använda lämpliga HTML-taggar för att fylla tabellen med korrekta rader och kolumner.
Här är data som ska inkluderas:
1. Name: **Emma Johnson** | Position: **Sales Associate** | Wage: **$15.50 per hour**.
2. Name: **Liam Thompson** | Position: **Customer Service Representative** | Wage: **$14.75 per hour**.
3. Name: **Olivia Rodriguez** | Position: **Marketing Coordinator** | Wage: **$18.25 per hour**.
4. Name: **Noah Smith** | Position: **IT Support Specialist** | Wage: **$20.00 per hour**.
5. Name: **Ava Davis** | Position: **Administrative Assistant** | Wage: **$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. Använd taggen `<table>` för att definiera huvudbehållaren för tabellen;
2. Använd taggen `<thead>` för att gruppera tabellens rubrikinnehåll, såsom kolumnrubriker;
3. Använd taggen `<tr>` för att definiera en ny rad i tabellen;
4. Använd taggen `<th>` för att definiera rubriktexten för varje kolumn;
5. Använd taggen `<tbody>` för att gruppera tabellens huvudinnehåll, inklusive rader och dataceller;
6. Använd taggen `<td>` för att definiera själva datan eller innehållet i varje tabellcell.


Tips

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <link rel="stylesheet" href="index.css" />
  </head>
  <body>
    <table>
      
      <thead>
        <tr>
          <th>Name</th>
          <th>Position</th>
          <th>Wage</th>
        </tr>
      </thead>

      
      <tbody>
        
        <tr>
          <td>Emma Johnson</td>
          <td>Sales Associate</td>
          <td>$15.50 per hour</td>
        </tr>
        
        <tr>
          <td>Liam Thompson</td>
          <td>Customer Service Representative</td>
          <td>$14.75 per hour</td>
        </tr>
        
        <tr>
          <td>Olivia Rodriguez</td>
          <td>Marketing Coordinator</td>
          <td>$18.25 per hour</td>
        </tr>
        
        <tr>
          <td>Noah Smith</td>
          <td>IT Support Specialist</td>
          <td>$20.00 per hour</td>
        </tr>
        
        <tr>
          <td>Ava Davis</td>
          <td>Administrative Assistant</td>
          <td>$16.80 per hour</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>
```

Lösning

Lär dig grunderna i HTML (HyperText Markup Language), grunden för webbutveckling. Denna nybörjarvänliga kurs täcker taggar, attribut, element och strukturering av webbsidor. Få praktiska färdigheter i att skapa rubriker, stycken, listor, bilder, länkar, formulär och tabeller. Utforska bästa praxis, optimering och webbtillgänglighet. Börja din webbutvecklingsresa med HTML.

Utforska webben inre funktioner. Lär dig hur data färdas över nätverk, upptäck protokollens roll och lös mysterierna med IP-adresser och domännamn. Få en övergripande förståelse för hur webbläsare och servrar kommunicerar för att leverera webb-innehåll.

Upptäck kraften i taggar för att strukturera innehåll, från rubriker och stycken till listor och tabeller. Lär dig hur du förbättrar elementen med attribut.

Kärnan i HTML-dokumentstrukturen. Lär dig komponenterna i ett HTML-dokument, inklusive doctype-deklarationen, head och body. Förstå syftet med varje element och hur de bidrar till den övergripande strukturen på en webbsida.

Gör en webbsida mer tilltalande med hjälp av media som bilder, ljud och video. Arbeta med strukturerad tabulär data i form av tabeller.

Utforska mångsidigheten hos HTML-formulär. Lär dig att designa intuitiva och användarvänliga formulär genom att utnyttja viktiga koncept och tekniker. Upptäck hur formulär möjliggör användarinteraktion och dataöverföring på webbplatser.

Utmaning: Designa en Funktionell HTML-Tabell

Mål

Uppgift