Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Oppiskele Haaste: Työskentele Taulukoiden Kanssa | Taulukot ja Lomakkeet
HTML:n Perusteet

bookHaaste: Työskentele Taulukoiden Kanssa

Tehtävä

Luo HTML-taulukko ravintolan ruokalistan esittämiseksi, mukaan lukien annosten nimet, kuvaukset ja hinnat. Täytä taulukko seuraavilla tiedoilla käyttäen oikeaa taulukkorakennetta.

  1. Savory Bliss Bowl
    • Kuvaus: Quinoa, paahdetut kasvikset, grillattu kana, tahinikastike;
    • Hinta: $12.99.
  2. Mediterranean Delight Wrap
    • Kuvaus: Halloumi-juusto, pinaatti, tomaatit, tzatziki rullassa;
    • Hinta: $10.49.
  3. Sizzling BBQ Burger
    • Kuvaus: Naudanlihapihvi, pekoni, cheddar, karamellisoidut sipulit, ranskalaiset;
    • Hinta: $13.99.
  4. Veggie Harvest Salad
    • Kuvaus: Salaatti, bataatti, kikherneet, avokado, feta, vinaigrette-kastike;
    • Hinta: $9.99.
  5. Seafood Pasta Extravaganza
    • Kuvaus: Katkaravut, kampasimpukat, sinisimpukat, linguine-pasta, valkosipuli-viinikastike;
    • Hinta: $16.99.
index.html

index.html

copy

Vihje

  • Vaihe 1: Luo taulun rakenne käyttämällä <table>-tagia. Taulun sisällä käytä <thead>-tagia taulun otsikolle ja <tbody>-tagia taulun sisällölle. Lisää <thead>-osioon rivi (<tr>) ja taulukon otsikkosolut (<th>) jokaiselle sarakkeelle: Item, Description ja Price.
  • Vaihe 2: Täytä taulu ruokalistan tuotteilla lisäämällä rivejä (<tr>) <tbody>-osioon. Käytä taulukon tietosoluja (<td>) jokaisessa rivissä (<tr>) määrittääksesi kunkin ruokalistan tuotteen tiedot.
index.html

index.html

copy
Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 4. Luku 2

Kysy tekoälyä

expand

Kysy tekoälyä

ChatGPT

Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme

Suggested prompts:

Can you show me the HTML code for the table?

Can you explain how to structure the table rows and columns?

Can you give tips for styling the table?

bookHaaste: Työskentele Taulukoiden Kanssa

Pyyhkäise näyttääksesi valikon

Tehtävä

Luo HTML-taulukko ravintolan ruokalistan esittämiseksi, mukaan lukien annosten nimet, kuvaukset ja hinnat. Täytä taulukko seuraavilla tiedoilla käyttäen oikeaa taulukkorakennetta.

  1. Savory Bliss Bowl
    • Kuvaus: Quinoa, paahdetut kasvikset, grillattu kana, tahinikastike;
    • Hinta: $12.99.
  2. Mediterranean Delight Wrap
    • Kuvaus: Halloumi-juusto, pinaatti, tomaatit, tzatziki rullassa;
    • Hinta: $10.49.
  3. Sizzling BBQ Burger
    • Kuvaus: Naudanlihapihvi, pekoni, cheddar, karamellisoidut sipulit, ranskalaiset;
    • Hinta: $13.99.
  4. Veggie Harvest Salad
    • Kuvaus: Salaatti, bataatti, kikherneet, avokado, feta, vinaigrette-kastike;
    • Hinta: $9.99.
  5. Seafood Pasta Extravaganza
    • Kuvaus: Katkaravut, kampasimpukat, sinisimpukat, linguine-pasta, valkosipuli-viinikastike;
    • Hinta: $16.99.
index.html

index.html

copy

Vihje

  • Vaihe 1: Luo taulun rakenne käyttämällä <table>-tagia. Taulun sisällä käytä <thead>-tagia taulun otsikolle ja <tbody>-tagia taulun sisällölle. Lisää <thead>-osioon rivi (<tr>) ja taulukon otsikkosolut (<th>) jokaiselle sarakkeelle: Item, Description ja Price.
  • Vaihe 2: Täytä taulu ruokalistan tuotteilla lisäämällä rivejä (<tr>) <tbody>-osioon. Käytä taulukon tietosoluja (<td>) jokaisessa rivissä (<tr>) määrittääksesi kunkin ruokalistan tuotteen tiedot.
index.html

index.html

copy
Oliko kaikki selvää?

Miten voimme parantaa sitä?

Kiitos palautteestasi!

Osio 4. Luku 2
some-alt