Input 類型: color

<form action="demo.php">
  選擇你喜歡的顏色: <input type="color" name="favcolor"><br>
  <input type="submit">
</form>

效果：

Input 類型: date

<form action="form.php">
  生日: <input type="date" name=
 
"bday">
  <input type="submit">
</form>

效果：

Input 類型: datetime-local

<form action="form.php">
  生日 (日期和時間): <input type="datetime-local" name="bdaytime">
  <input type="submit">
</form>

效果：

Input 類型: email

<form action="form.php">
        E-mail: <input type="email" name="usremail">
        <input type="submit">
</form>

效果：

Input 類型: month

<form action="-form.php">
  生日 ( 月和年 ): <input type="month" name="bdaymonth"
 
>
  <input type="submit">
</form>

效果：

Input 類型: number

<form action="form.php">
  數量 ( 1 到 5 之間): <input type="number" name="quantity" min="1" max="5">
  <input type="submit">
</form>

效果：

Input 類型: range

range 類型用於應該包含一定範圍內數字值的輸入域。

range 類型顯示為滑動條。

<form action="demo-form.php" method="get">
    Points: <input type="range" name="points" min="1" max="10">
    <input type="submit">
</form>

效果：

請使用下面的屬性來規定對數字類型的限定：

• max - 規定允許的最大值
• min - 規定允許的最小值
• step - 規定合法的數字間隔
• value - 規定默認值

Input 類型: time

search 類型用於搜索域，比如站點搜索或 Google 搜索。

<form action="form.php">
    選擇時間: <input type="time" name="usr_time">
    <input type="submit">
</form>

效果：

Input 類型: url

url類型用於應該包含 URL地址的輸入域。

在提交表單時，會自動驗證url域的值。

<form action="form.php">
    添加你的主頁: <input type="url" name="homepage"><br>
    <input type="submit">
</form>

效果：

Input 類型: week

week 類型允許你選擇周和年。

<form action="demo-form.php">
  選擇周: <input type="week" name="year_week">
  <input type="submit">
</form>

效果：

Html5新的Input 類型