Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lära Utmaning: Designa en Funktionell HTML-Tabell | Arbeta med Media och Tabeller
Ultimate HTML
course content

Kursinnehåll

Ultimate HTML

Ultimate HTML

1. Förstå Webbutveckling
Välkommen till HTML och WebbutvecklingVad Är Internet?Hur Fungerar Internet?Förstå Hur Webbplatser FungerarFrontend- och Backendutveckling Förklarat
2. HTML-Taggar och Attribut
Förstå HTML-TaggarArbeta med HTML-AttributFörstå Parvisa och Enkla Taggar i HTMLTextmarkering och Formatering i HTMLUtmaning: Skapa Ditt Första WebbsidesstyckeUtmaning: Bygg en Personlig IntroduktionswebbsidaUtmaning: Designa en FilmskyltwebbsidaAnvända Länkar och Knappar i HTMLUtmaning: Skapa Länkar till Populära WebbplatserValidera Din HTML-Kod för Bästa Praxis
3. HTML-Dokumentstruktur
Hemligheterna Bakom Välstrukturerade WebbsidorFörstå HTML-DokumentstrukturDokumenthuvudets RollHantera Dokumentflöde och LayoutUtmaning: Strukturera ett HTML-Dokument KorrektAnvända Utvecklarverktyg för HTML-Inspektion och Felsökning
4. Arbeta med Media och Tabeller
Lägga till Bilder i HTMLUtmaning: Arbeta med BilderArbeta med Klickbara Bilder, Bildtexter och OptimeringFörståelse för Vektor- och RastergrafikBädda in Ljud och Video för Rikt MedieinnehållUtmaning: Bädda in Ljud och Video i HTMLSkapa och Strukturera Tabeller i HTMLUtmaning: Designa en Funktionell HTML-Tabell
5. HTML-Formulär och Användarinmatning
Introduktion till HTML-FormulärGrunderna i Formulärskapande i HTMLAnvända Etiketter för Bättre FormuläråtkomstFörbättra Formulär med InputattributUtforska Olika Inmatningstyper i HTMLUtmaning: Skapa Formulär med Inputs och EtiketterArbeta med Textarea-Elementet för Flerradig InmatningAnvända Select-Elementet för RullgardinsmenyerAnvända Datalistelementet för Fördefinierade InmatningsförslagGruppera Formulärelement för Bättre Struktur

book
Utmaning: Designa en Funktionell HTML-Tabell

Mål

Presentera anställdas information 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: Namn, Position och Lön. Fokusera på att använda lämpliga HTML-taggar för att fylla tabellen med rätt rader och kolumner. Här är data att inkludera:

  1. Namn: Emma Johnson | Position: Sales Associate | Lön: $15.50 per timme.
  2. Namn: Liam Thompson | Position: Customer Service Representative | Lön: $14.75 per timme.
  3. Namn: Olivia Rodriguez | Position: Marketing Coordinator | Lön: $18.25 per timme.
  4. Namn: Noah Smith | Position: IT Support Specialist | Lön: $20.00 per timme.
  5. Namn: Ava Davis | Position: Administrative Assistant | Lön: $16.80 per timme.
index.html

index.html

index.css

index.css

copy
  1. Använd table-taggen för att definiera huvudbehållaren för tabellen.
  2. Använd thead-taggen för att gruppera tabellens rubrikinnehåll, såsom kolumnrubriker.
  3. Använd tr-taggen för att definiera en ny rad inom tabellen.
  4. Använd th-taggen för att definiera rubriktexten för varje kolumn.
  5. Använd tbody-taggen för att gruppera huvudinnehållet i tabellen, vilket inkluderar rader och dataceller.
  6. Använd td-taggen för att definiera den faktiska datan eller innehållet inom varje cell i tabellen.
index.html

index.html

index.css

index.css

copy
Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 8

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

course content

Kursinnehåll

Ultimate HTML

Ultimate HTML

1. Förstå Webbutveckling
Välkommen till HTML och WebbutvecklingVad Är Internet?Hur Fungerar Internet?Förstå Hur Webbplatser FungerarFrontend- och Backendutveckling Förklarat
2. HTML-Taggar och Attribut
Förstå HTML-TaggarArbeta med HTML-AttributFörstå Parvisa och Enkla Taggar i HTMLTextmarkering och Formatering i HTMLUtmaning: Skapa Ditt Första WebbsidesstyckeUtmaning: Bygg en Personlig IntroduktionswebbsidaUtmaning: Designa en FilmskyltwebbsidaAnvända Länkar och Knappar i HTMLUtmaning: Skapa Länkar till Populära WebbplatserValidera Din HTML-Kod för Bästa Praxis
3. HTML-Dokumentstruktur
Hemligheterna Bakom Välstrukturerade WebbsidorFörstå HTML-DokumentstrukturDokumenthuvudets RollHantera Dokumentflöde och LayoutUtmaning: Strukturera ett HTML-Dokument KorrektAnvända Utvecklarverktyg för HTML-Inspektion och Felsökning
4. Arbeta med Media och Tabeller
Lägga till Bilder i HTMLUtmaning: Arbeta med BilderArbeta med Klickbara Bilder, Bildtexter och OptimeringFörståelse för Vektor- och RastergrafikBädda in Ljud och Video för Rikt MedieinnehållUtmaning: Bädda in Ljud och Video i HTMLSkapa och Strukturera Tabeller i HTMLUtmaning: Designa en Funktionell HTML-Tabell
5. HTML-Formulär och Användarinmatning
Introduktion till HTML-FormulärGrunderna i Formulärskapande i HTMLAnvända Etiketter för Bättre FormuläråtkomstFörbättra Formulär med InputattributUtforska Olika Inmatningstyper i HTMLUtmaning: Skapa Formulär med Inputs och EtiketterArbeta med Textarea-Elementet för Flerradig InmatningAnvända Select-Elementet för RullgardinsmenyerAnvända Datalistelementet för Fördefinierade InmatningsförslagGruppera Formulärelement för Bättre Struktur

book
Utmaning: Designa en Funktionell HTML-Tabell

Mål

Presentera anställdas information 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: Namn, Position och Lön. Fokusera på att använda lämpliga HTML-taggar för att fylla tabellen med rätt rader och kolumner. Här är data att inkludera:

  1. Namn: Emma Johnson | Position: Sales Associate | Lön: $15.50 per timme.
  2. Namn: Liam Thompson | Position: Customer Service Representative | Lön: $14.75 per timme.
  3. Namn: Olivia Rodriguez | Position: Marketing Coordinator | Lön: $18.25 per timme.
  4. Namn: Noah Smith | Position: IT Support Specialist | Lön: $20.00 per timme.
  5. Namn: Ava Davis | Position: Administrative Assistant | Lön: $16.80 per timme.
index.html

index.html

index.css

index.css

copy
  1. Använd table-taggen för att definiera huvudbehållaren för tabellen.
  2. Använd thead-taggen för att gruppera tabellens rubrikinnehåll, såsom kolumnrubriker.
  3. Använd tr-taggen för att definiera en ny rad inom tabellen.
  4. Använd th-taggen för att definiera rubriktexten för varje kolumn.
  5. Använd tbody-taggen för att gruppera huvudinnehållet i tabellen, vilket inkluderar rader och dataceller.
  6. Använd td-taggen för att definiera den faktiska datan eller innehållet inom varje cell i tabellen.
index.html

index.html

index.css

index.css

copy
Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 4. Kapitel 8
some-alt