Summary  
This chapter covers customizing HTML input elements using attributes like value, autofocus, required, and placeholder to control default content, focus behavior, validation requirements, and helper text.

General domain of usage  
Web form design

HTML-`<input>`-element kan anpassas med attribut som ändrar deras beteende. Nedan följer några av de mest använda attributen.

## value
Anger det initiala värdet för ett inputfält.
- För knappar: definierar knappens text;
- För text-/lösenordsfält: anger standardtexten;
- För kryssrutor/radioknappar: anger värdet som skickas när de är valda.

`value` kan inte användas med `type="file"`.

Notera

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGlucHV0IHR5cGU9ImJ1dHRvbiIgdmFsdWU9IkNsaWNrIE1lIiAvPgogIDxpbnB1dCB0eXBlPSJ0ZXh0IiB2YWx1ZT0iRGVmYXVsdCBUZXh0IiAvPgogIDxpbnB1dCB0eXBlPSJjaGVja2JveCIgdmFsdWU9Im5ld3NsZXR0ZXIiIC8+CjwvZm9ybT4=

## autofocus
Fokuserar automatiskt på ett inmatningsfält när sidan laddas.

Det fungerar inte i exemplet nedan eftersom sidan inte laddas om när du trycker på Kör kod.

Observera

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0icXVlc3Rpb24iPllvdXIgcXVlc3Rpb248L2xhYmVsPgogIDxpbnB1dCB0eXBlPSJ0ZXh0IiBpZD0icXVlc3Rpb24iIGF1dG9mb2N1cyAvPgogIAogIDxsYWJlbCBmb3I9Im5hbWUiPllvdXIgTmFtZTwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRleHQiIGlkPSJuYW1lIiAvPgo8L2Zvcm0+

## required
Gör ett inmatningsfält obligatoriskt. Formuläret kan inte skickas förrän fältet är ifyllt.

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0iZW1haWwiPkVtYWlsPC9sYWJlbD4KICA8aW5wdXQgdHlwZT0idGV4dCIgaWQ9ImVtYWlsIiByZXF1aXJlZCAvPgogIAogIDxsYWJlbCBmb3I9InBhc3N3b3JkIj5QYXNzd29yZDwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InBhc3N3b3JkIiBpZD0icGFzc3dvcmQiIHJlcXVpcmVkIC8+CiAgCiAgPGJ1dHRvbiB0eXBlPSJzdWJtaXQiPlJlZ2lzdGVyPC9idXR0b24+CjwvZm9ybT4=

## placeholder
Visar hjälpinformation i inmatningsfältet tills användaren skriver något. Användbart för format som telefonnummer eller kortuppgifter.

PGZvcm0gb25zdWJtaXQ9InJldHVybiBmYWxzZSI+CiAgPGxhYmVsIGZvcj0icGhvbmUiPlBob25lIE51bWJlcjwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRlbCIgaWQ9InBob25lIiBwbGFjZWhvbGRlcj0iKzEtKFhYWClYWFgtWFhYIiAvPgogIAogIDxsYWJlbCBmb3I9ImNhcmQiPkNhcmQgZGV0YWlsczwvbGFiZWw+CiAgPGlucHV0IHR5cGU9InRleHQiIGlkPSJjYXJkIiBwbGFjZWhvbGRlcj0iWFhYWC1YWFhYLVhYWFgtWFhYWCIgLz4KICAKICA8YnV0dG9uIHR5cGU9InN1Ym1pdCI+TWFrZSBQYXltZW50PC9idXR0b24+CjwvZm9ybT4=

Varje exempel använder olika `type`-attribut, vilket påverkar hur inmatningsfältet fungerar. Du kommer att utforska inmatningstyper i nästa kapitel.

Vilken attribut används för att ange standardvärdet för ett input-element?

Vilken attribut används för att ange en ledtråd eller ett exempel på det förväntade värdet för ett `input`-element?

Vilken attribut används för att ange att ett inmatningsfält måste fyllas i innan formuläret skickas?

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.

Enhancing Forms With Input Attributes

value

autofocus

required

placeholder

1. Vilken attribut används för att ange standardvärdet för ett input-element?

2. Vilken attribut används för att ange en ledtråd eller ett exempel på det förväntade värdet för ett `input`-element?

3. Vilken attribut används för att ange att ett inmatningsfält måste fyllas i innan formuläret skickas?