Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære Utfordring: Lag Skjema med Inndatafelt og Etiketter | HTML-Skjemaer og Brukerinput
Ultimate HTML

bookUtfordring: Lag Skjema med Inndatafelt og Etiketter

Mål

Forbedre brukeropplevelsen på nettstedet ved å lage et interaktivt skjema som krever inndata for navn, e-post og passord, med tilhørende etiketter.

Oppgave

Legg til et enkelt, brukervennlig skjema på siden din. Følg disse kravene:

  1. Navn-felt
    • Bruk et tekstfelt.
    • Sett plassholderen til John.
    • Gjør feltet fokusert som standard (autofokus).
  2. E-post-felt
    • Bruk et e-postfelt.
    • Sett plassholderen til example@gmail.com.
    • Merk feltet som obligatorisk.
  3. Passord-felt
    • Bruk et passordfelt.
    • Gjør dette feltet obligatorisk.
index.html

index.html

index.css

index.css

copy
  1. autofocus: fokuserer automatisk på inndatafeltet når siden lastes inn.
  2. required: markerer inndatafeltet som obligatorisk, og forhindrer innsending av skjemaet hvis det står tomt.
  3. placeholder: gir et hint eller eksempeltekst for inndatafeltet.
  4. for og id: knytter en etikett til et inndatafelt for bedre tilgjengelighet.
  5. type: angir hvilken type data som forventes i inndatafeltet (f.eks. tekst, e-post, passord).
index.html

index.html

index.css

index.css

copy
Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 6

Spør AI

expand

Spør AI

ChatGPT

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Suggested prompts:

Can you explain how the form validation works in this example?

What happens if a required field is left empty?

How can I further customize the appearance of the form?

bookUtfordring: Lag Skjema med Inndatafelt og Etiketter

Sveip for å vise menyen

Mål

Forbedre brukeropplevelsen på nettstedet ved å lage et interaktivt skjema som krever inndata for navn, e-post og passord, med tilhørende etiketter.

Oppgave

Legg til et enkelt, brukervennlig skjema på siden din. Følg disse kravene:

  1. Navn-felt
    • Bruk et tekstfelt.
    • Sett plassholderen til John.
    • Gjør feltet fokusert som standard (autofokus).
  2. E-post-felt
    • Bruk et e-postfelt.
    • Sett plassholderen til example@gmail.com.
    • Merk feltet som obligatorisk.
  3. Passord-felt
    • Bruk et passordfelt.
    • Gjør dette feltet obligatorisk.
index.html

index.html

index.css

index.css

copy
  1. autofocus: fokuserer automatisk på inndatafeltet når siden lastes inn.
  2. required: markerer inndatafeltet som obligatorisk, og forhindrer innsending av skjemaet hvis det står tomt.
  3. placeholder: gir et hint eller eksempeltekst for inndatafeltet.
  4. for og id: knytter en etikett til et inndatafelt for bedre tilgjengelighet.
  5. type: angir hvilken type data som forventes i inndatafeltet (f.eks. tekst, e-post, passord).
index.html

index.html

index.css

index.css

copy
Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 6
some-alt