lovecoding
/
VIP30


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
							<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <form action="">
    text: <input type="text"> <br>
    email: <input type="email"><br>
    <!-- 
      type: email
      会对输入的内容进行一个邮箱格式的校验
      必须要包含 @
      @ 后面要有内容
    -->

    color: <input type="color"><br>
    <!-- 
      type: color
      调色板
    -->

    date: <input type="date"><br>
    <!-- 
      type: date
      日历功能    带有自己的样式
    -->
    time: <input type="time"><br>
    <!-- 
      type: time
      时间功能
    -->
    range: <input type="range"><br>
    range: <input type="range" step="20"><br>
    <!-- 
      type: range
      滑块类型
      setp属性  定义每一次滑动的距离
    -->

    search: <input type="search"><br>
    <!-- 
      type: search
      输入框可以输入内容 但是带有自己的清除按键
    -->

    number: <input type="number" max="20" min="9" step="2"> <br>
    <!-- 
      type: number
      如果超出有效值  默认调整为最近的有效值
    -->

    tel: <input type="tel" maxlength="11"><br>
    <!-- 
      type: tel
      maxlength  输入的最大长度
      在手机端会默认唤醒拨号键盘
    -->
    file: <input type="file" accept="image/png"><br>
    <!-- 
      type: file
      上传文件
      accept 设置选择文件的类型
    -->

    <select name="" id="">
      <option value="xx">1</option>
      <option value="aa">2</option>
    </select>


    <input type="text"  list="list1">

    <datalist id="list1">
      <option value="xiaoming" label="zhang">xiaoming</option>
      <option value="xiaohong">xiaohong</option>
      <option value="xiaoming" label="wang">xiaoming</option>
    </datalist>

    <br>
    <input type="submit">
  </form>
</body>
</html>