Html input types you don’t use
COLOR
The <input type=”color”> opens the color picker tool.
HTML CSS
<p>Choose your monster’s colors : </p>
<div>
<input type=”color” id=”head” name=”head” value=”#e66465″>
<label for=”head” >Head</labels>
< /div>
<div>
<input type=”color” id=”body” name=”body” value=”#f6b73c “>
<label for=”body”>Body</label>
</div>
Output:
Choose your monster’s colors:
Head
Body
TEL
The <input type=”tel”> helps you to take a phone number.
HTML CSS
<label for=”phone”>Enter your phone number:</label>
<input type=”tel” id=”phone” name=”phone” pattern=”[e-9]{3}-[e-9]{3}-[e-9]{4}”required>
<small> Format: 123-456-7890</small>
Output:
Choose a time for your meeting;
–:– – – Office hours are 9am to 6pm
RANGE
The <input type=”range”> helps you to select a particular range.
HTML CSS
<p>Audio settings: </p>
<div>
< input type=”range” id=”volume” name=”volume”min=”0″ max=”11″>
<label for=”volume”> Volume</label>
</div>
<div>
<input type=”range” id=”cowbell” name=”cowbell” min=”0” max=”100″ value=”90″ step=”10″>
<label for=”cowbell”>Cowbell</label>
< /div>
Output
Audio Settings:
Volume
Cowbell
TIME
The <input type=”time”> creates input fields designed to let the user easily enter a time (hours and minutes, and optionally seconds).
HTML CSS
<label for=”appt”>Choose a time for your meeting:
</label>
< input type=”time” id=”appt” name= “appt” min=”09:0e” max=”18:00″ required>
<small>0ffice hours are 9am to 6pm</small>
Output
Choose a time for your meeting:
– : — – – Office hours are 9 am to 6 pm