Utfordring: Opprett Skjema med Inndata og Etiketter

Mål

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

Oppgave

Inkluder et brukervennlig skjema på nettstedet ditt for å forbedre brukerengasjement og interaksjon. Din oppgave er å:

For navnefeltet: opprette et tekstfelt som samler inn brukernes navn. Bruk de riktige attributtene for å sikre en sømløs opplevelse.
1. Definer riktig type for tekstfeltet;
2. Sett placeholder til John;
3. Sørg for at feltet er fokusert som standard.
For e-postfeltet: opprett et e-postfelt som samler inn brukernes e-postadresser. Sikre datanøyaktighet ved å bruke de riktige attributtene.
1. Definer riktig type for e-postfeltet;
2. Sett placeholder til example@gmail.com;
3. Merk feltet som obligatorisk.
For passordfeltet: opprett et sikkert passordfelt som beskytter brukerdata. Bruk de riktige attributtene for å forbedre databeskyttelsen.
1. Definer riktig type for passordfeltet;
2. Gjør feltet obligatorisk.

index.html

index.css

autofocus: fokuserer automatisk på inndatafeltet når siden lastes.
required: markerer inndatafeltet som obligatorisk, og forhindrer innsending av skjemaet hvis det er tomt.
placeholder: gir en hint eller eksempeltekst for inndatafeltet.
for og id: knytter en etikett til et inndatafelt for bedre tilgjengelighet.
type: spesifiserer typen data som forventes i inndatafeltet (f.eks. text, email, password).

index.html

index.css

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 6

Spør AI

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

Kursinnhold

Ultimate HTML

1. Forstå Webutvikling

Velkommen til HTML og Webutvikling Hva Er Internett?Hvordan Fungerer Internett?Forstå Hvordan Nettsteder Fungerer Frontend- og Backend-utvikling Forklart

2. HTML-Koder og Attributter

3. HTML-Dokumentstruktur

4. Arbeide med Media og Tabeller

5. HTML-Skjemaer og Brukerinput

Utfordring: Opprett Skjema med Inndata og Etiketter

Mål

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

Oppgave

Inkluder et brukervennlig skjema på nettstedet ditt for å forbedre brukerengasjement og interaksjon. Din oppgave er å:

For navnefeltet: opprette et tekstfelt som samler inn brukernes navn. Bruk de riktige attributtene for å sikre en sømløs opplevelse.
1. Definer riktig type for tekstfeltet;
2. Sett placeholder til John;
3. Sørg for at feltet er fokusert som standard.
For e-postfeltet: opprett et e-postfelt som samler inn brukernes e-postadresser. Sikre datanøyaktighet ved å bruke de riktige attributtene.
1. Definer riktig type for e-postfeltet;
2. Sett placeholder til example@gmail.com;
3. Merk feltet som obligatorisk.
For passordfeltet: opprett et sikkert passordfelt som beskytter brukerdata. Bruk de riktige attributtene for å forbedre databeskyttelsen.
1. Definer riktig type for passordfeltet;
2. Gjør feltet obligatorisk.

index.html

index.css

autofocus: fokuserer automatisk på inndatafeltet når siden lastes.
required: markerer inndatafeltet som obligatorisk, og forhindrer innsending av skjemaet hvis det er tomt.
placeholder: gir en hint eller eksempeltekst for inndatafeltet.
for og id: knytter en etikett til et inndatafelt for bedre tilgjengelighet.
type: spesifiserer typen data som forventes i inndatafeltet (f.eks. text, email, password).

index.html

index.css

Alt var klart?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 6