HTML Input attributen
De volgende attributen van het element input worden hieronder beschreven:accept, accesskey, align, alt, border, checked, disabled, height, hspace, ismap, maxlength, readonly, size, src, tabindex, usemap, value, vspace en width.
 |
Zie Input type in het menu voor de beschrijving van de attributen "type" en "name". |
Accept attribuut
Het accept attribuut geeft aan welke bestandstypen de server accepteert. Dit is ideaal voor het uploaden van bestanden. De browser kan deze informatie gebruiken, om niet overeenkomstige bestandstypes uit te filteren.
Je kunt de volgende waarden gebruiken in het accept attribuut:
<input accept="extensie | audio/* | video/* | image/*">
| extensie | - | Bestandsextensie bijv: .gif, .jpg, .txt, .doc |
| audio/* | - | Alle geluidsbestanden worden geaccepteerd. |
| video/* | - | Alle videobestanden worden geaccepteerd. |
| image/* | - | Alle afbeeldingsbestanden worden geaccepteerd. |
Voorbeeld:
Selecteer een bestand:<br>
<input type="file" name="pic" accept="image/*">
<input type="submit" value="Bestand uploaden">
Accesskey attribuut
Het accesskey attribuut wordt gebruikt om een sneltoets aan het input element te koppelen. De manier van toegang tot de sneltoets kan variëren in verschillende browsers. Bij Internet Explorer wordt de toets ingedrukt, samen met de ALT-toets.
Align attribuut
Het align attribuut geeft voor image-elementen aan waar de afbeelding ten opzichte van de bijhorende tekst wordt weergegeven. Mogelijke waarden voor de uitlijning zijn:
- Horizontaal: left, right
- Verticaal: top, middle, bottom
In de onderstaande voorbeeld hebben we gekozen voor de waarde "middle" dit betekent dat de basislijn van de omringende tekst even hoog is als het midden van de afbeelding.
 |
Het align attribuut is verouderd en wordt niet ondersteund in HTML 4.01, er wordt sterk aangeraden om hiervoor CSS te gebruiken. Voor een verticale uitlijning van een afbeelding gebruik je de CSS-eigenschap: vertical-align en voor de horizontale uitlijning gebruik je de CSS-eigenschap: float. |
Alt attribuut
Het alt attribuut wordt gebruikt om een alternatieve beschrijving van een afbeelding te geven, als de afbeelding niet kan worden weergegeven. Dit is vooral belangrijk als de pagina langzaam wordt geladen of als de gebruiker een schermlezer gebruikt. Gebruik daarom altijd het alt attribuut.
Border attribuut
Met het border attribuut kan je een rand om een afbeelding plaatsen. De bezoekers kunnen zien dat er op de afbeelding geklikt kan worden.
Checked attribuut
Zorgt ervoor dat een bepaald keuzerondje of selectievakje geselecteerd is als het formulier verschijnt.
Disabled attribuut
Met dit attribuut kan het veld niet meer bewerkt worden. Ook kan de tekst niet meer worden geselecteerd.
Voorbeeld:
Voornaam:<br>
<input type="text" name="voornaam" value="Alex" disabled="disabled">
Height attribuut
Met het height attribuut kan de hoogte van een afbeelding worden vastgelegd. Als de afbeelding een andere afmeting heeft dan wordt deze aangepast. De attribuut waarden worden standaard opgegeven in pixels.
|
Wanneer niet gelijktijdig het width attribuut wordt opgenomen, wordt de breedte van de afbeelding in dezelfde verhouding als de hoogte gewijzigd. |
Hspace attribuut
Met het hspace attribuut wordt de witruimte links en rechts van de afbeelding aangegeven. Door dit attribuut op te nemen, wordt voorkomen dat de tekst te dicht tegen de afbeelding, of afbeeldingen te dicht tegen elkaar geplaatst worden. Samen met het attribuut vspace specificeert dit extra witruimte rond de afbeelding.
|
Het hspace attribuut is verouderd en wordt niet ondersteund in HTML 4.01, er wordt aangeraden om hiervoor CSS te gebruiken. CSS biedt meer mogelijkheden voor opmaak. Als alternatief kan je de CSS-eigenschap: margin-left en margin-right gebruiken. |
Ismap attribuut
Het ismap attribuut geeft aan dat de afbeelding een actieve kaart "server-side image map" is, ofwel een aanklikbare afbeelding. De afbeelding zorgt ervoor dat het meerdere aanklikbare gebieden kan bevatten. Voor de werking ervan wordt vaak een cgi-script op de server aangeroepen die de verzoeken afhandelt.
De opbouw is als volgt:
<input type="image" src="ismap/landschap.jpg" ismap>Het Ismap attribuut is eigenlijk niet bedoeld om het te gebruiken met het <input> element. Er wordt aangeraden om het attribuut op te nemen in het <img> element. Een afbeelding met het ismap attribuut dat in een hyperlink is opgenomen, worden de coördinaten van de klik verzonden naar de opgegeven url. Coördinaten worden gescheiden door een komma en aangegeven in pixels.
Maxlength attribuut
Hiermee wordt het maximaal aantal tekens dat ingevoerd kan worden ingesteld.
Readonly attribuut
De gebruiker kan de inhoud of de status van het veld niet wijzigen.
Voorbeeld:
Voornaam:<br>
<input type="text" name="voornaam" value="Alex" readonly="readonly">
Size attribuut
Hiermee wordt bepaald hoe breed het veld op het scherm moet worden weergegeven.
Src attribuut
Met het src attribuut wordt het adres van de afbeelding bepaald. Wordt gebruikt samen met het type attribuut.
Tabindex attribuut
Het tabindex attribuut wordt gebruikt om de tab-volgorde te bepalen wanneer gebruikers gebruik maken van de tab-toets om te navigeren door een pagina. In bepaalde omstandigheden kan het nodig zijn om af te wijken van de standaard tab-volgorde.
Usemap attribuut
Het attribuut usemap geeft aan dat de afbeelding een "client-side-image map" is. Oudere browsers staan toe om een afbeelding op te nemen in het <input> element om te gebruiken als een image map. Een image map wordt gebruikt om de positie van de muisaanwijzer over de afbeelding te volgen, en een tooltip aan te geven wanneerde aanwijzer op een bepaald punt komt te staan.
De opbouw is als volgt:
<input type="image" src="images/figuren.jpg" usemap="#mapnaam">Bij moderne browsers is het niet toegestaan om een afbeelding op te nemen in het <input> element om te gebruiken als een image map. Om toch gebruik te kunnen maken van een afbeelding als image map kan je het element <img> gebruiken.
Value attribuut
Het value attribuut bepaald de standaard tekst welke in het invoerveld wordt weergegeven.
Vspace attribuut
Met het vspace attribuut wordt de witruimte boven en onder de afbeelding aangegeven. Door dit attribuut op te nemen, wordt voorkomen dat de tekst te dicht tegen de afbeelding, of afbeeldingen te dicht tegen elkaar geplaatst worden. Samen met het attribuut hspace specificeert dit extra witruimte rond de afbeelding.
|
Het vspace attribuut is verouderd en wordt niet ondersteund in HTML 4.01, er wordt aangeraden om hiervoor CSS te gebruiken. CSS biedt meer mogelijkheden voor opmaak. Als alternatief kan je de CSS-eigenschap: margin-top en margin-bottom gebruiken. |
Width attribuut
Met het width attribuut kan de breedte van een afbeelding worden vastgelegd. Als de afbeelding een andere afmeting heeft dan wordt deze aangepast. De attribuut waarden worden standaard opgegeven in pixels.
|
Wanneer niet gelijktijdig het height attribuut wordt opgenomen, wordt de hoogte van de afbeelding in dezelfde verhouding als de breedte gewijzigd. |
