Slik bygger du tekststilinnganger for HTML5- og CSS3-baserte websider

De fleste formelementene på HTML5 og CSS3-websider er variasjoner av samme tag. Etiketten kan skape enkeltlinje tekstbokser, passord bokser, knapper og til og med usynlig innhold (for eksempel skjulte felt). De fleste av disse objektene deler de samme grunnleggende attributter, selv om det ytre utseendet kan være annerledes.

Hvordan lage et standard tekstfelt

Den vanligste formen for inngangselementet er et vanlig tekstfelt.

For å lage en grunnleggende tekstinnføring, trenger du et skjema og et innspillingselement. Legge til en etikett slik at brukeren vet hva han skal komme inn i tekstboksen, er også vanlig. Her er koden:

tekstboksen. html
Navn

Et innspillingselement har tre vanlige attributter:

• type : Typeattributtet indikerer typen av inngangselement dette er. Dette første eksempelet angir type til tekst, og oppretter en standard tekstboks. Andre typer oppretter passord, skjulte felt, boksene og knappene.

• id : ID-attributtet oppretter en identifikator for feltet. Når du bruker et programmeringsspråk til å trekke ut data fra dette elementet, bruk id for å angi hvilket felt du refererer til. Et id-felt begynner ofte med et hint-uttrykk for å indikere typen objekt det er (for eksempel txt indikerer en tekstboks).

  

• verdi : Dette attributtet bestemmer standardverdien for tekstboksen. Hvis du forlater dette attributtet, begynner tekstfeltet tomt.

Tekstfelt kan også ha andre attributter, som ikke brukes så ofte, som

• størrelse : Dette attributtet bestemmer antall tegn som vises.

• maxlength : Bruk denne attributtet til å angi det største antall tegn som er tillatt.

Det er ingen tag. Inngangskoder er et holdover fra dagene da mange koder ikke hadde sluttkoder. Du avslutter bare den opprinnelige etiketten med et skråstrek, som vist i foregående prøvekode.

Du lurer kanskje på hvorfor taggen ble lagt til hvis den ikke har noen effekt på utseendet eller oppførselen til skjemaet. I dette bestemte eksemplet har ikke taggen en effekt, men som alt annet i HTML, kan du gjøre fantastiske stil ting med det i CSS. Selv om etiketter ikke vanligvis har en standard stil, er de fortsatt nyttige.

Slik bygger du et passordfelt

Passord er akkurat som tekstbokser, bortsett fra at teksten ikke vises. I stedet vises en serie stjerner.

Følgende kode viser at passordene er nesten identiske med vanlige tekstfelter:

passord.html Skriv inn et passord
Skriv inn passord her

I dette eksemplet ble det opprettet et passordfelt med ID. Standardverdien til dette feltet er. Begrepet hemmelig vises ikke i feltet; Den vil bli erstattet med seks stjerner.

Passordfeltet gir praktisk talt ingen meningsfull sikkerhet. Det beskytter brukeren fra spionatellitter som glir over skulderen for å lese et passord, men det handler om det. De åpne standardene for HTML og programmeringsspråket betyr at passord ofte sendes i det åpne. Det finnes løsninger - for eksempel SSL-teknologien - men for øyeblikket bare vær oppmerksom på at passordfeltet ikke passer for å beskytte dine hemmeligheter.

Dette eksemplet gjør egentlig ikke noe med passordet, men du bruker andre teknologier for det.

Slik lager du tekst med flere linjer

Enkeltlinje-tekstfeltet er en kraftig funksjon, men noen ganger vil du ha noe med litt mer plass. Programmet demonstrerer hvordan du kan lage en side for et essayproblem.

Stjernen til dette programmet er en ny tagg::

essay. html Quiz
Navn
Vennligst skriv summen av vestlig tanke. Vær kort.

Her er noen ting du må huske på når du bruker taggen:

• Den trenger enattributt, akkurat som et innspillingselement.

• Du kan spesifisere størrelsen withandattributes.

• Innholdet går mellom kodene. Tekstområdet kan inneholde mye mer informasjon enn ordinære koder, så snarere enn å plassere dataene i attributtet, går innholdet i teksten mellom merkene og kodene.

Alt som er plassert mellom og i koden ender i utgangen også. Dette inkluderer mellomrom og vognretur. Hvis du ikke vil ha tomme mellomrom i tekstområdet, plasserer du sluttkoden rett ved siden av begynnelsen.