Vai al contenuto

Form HTML5


















<form id="myForm">
	<!-- Form tipo testo  -->
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" placeholder="Name" required><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" placeholder="Surname" autofocus required><br>
  <label for="fname">Credit Card:</label><br>
  <input type="text" id="fname" name="fname" placeholder="Credit Card" autocomplete="off"><br><br>
<hr>
 	<!-- Form tipo radio  -->
  <input type="radio" id="male" name="gender" value="male"> 
  <label for="male">Male</label><br>
  <input type="radio" id="female" name="gender" value="female" checked>
  <label for="female">Female</label><br>
  <input type="radio" id="other" name="gender" value="other">
  <label for="other">Other</label>
<hr>
 	<!-- Form tipo selezione  --> 
<label for="food" list="food">Favourite food:</label>   
<input type="text" list="food">  
<datalist id="food">
  <select>
	<option>Pizza</option>
	<option selected="">Ice Cream</option>
	<option>Sandwiches</option>
   </select>
</datalist>
<hr>
 	<!-- Form tipo data  -->
  <label for="birthdaytime">Birthday (date and time):</label>
  <input type="datetime-local" id="birthdaytime" name="birthdaytime">
<hr>
 	<!-- Form tipo settimana  -->  
  <label for="week">Select a week:</label>
  <input type="week" id="week" name="week">
<hr>
 	<!-- Form tipo email  -->  
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email">
<hr>
 	<!-- Form tipo website  -->   
  <label for="homepage">Add your homepage:</label>
  <input type="url" id="homepage" name="homepage">
<hr>
 	<!-- Form tipo range  --> 
  <label for="vol">Volume (between 0 and 50):</label>
  <input type="range" id="vol" name="vol" min="0" max="50">
<hr>
 	<!-- Form tipo bottone  -->
  <input type="button" onclick="" value="Click Me!">
  <input type="reset">
</form>

Per altre tipologie di form html guardare il sito: https://www.w3schools.com/html/html_forms.asp

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *