| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384 |
- <!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 style="height: 8000px;" action="">
- text:<input type="text"> <br>
- <!--
- type:email
- 会对我们输入的内容进行一个邮箱校验 包括@ 并且@后面有东西
- -->
- email:<input type="email"><br>
- <!--
- type: color
- 调色板
- -->
- color:<input type="color"><br>
- <!--
- type:date
- 选择日期
- -->
- date:<input type="date"><br>
- <!--
- type:time
- 选择时间
- -->
- time:<input type="time"><br>
- <!--
- type:range
- 滑块类型
- step属性 定义每一次滑动的距离
- -->
- range:<input type="range"><br>
- range:<input type="range" step="20"><br>
- <!--
- type:search
- 输入框可以输入内容 并且带有清除键
- -->
- search:<input type="search"><br>
- <!--
- type:number
- 输入数字
- step 输入值 不为有效值的时候 点击加减 默认调整到有效值
- max 最大值
- min 最小值
- 当我们输入的数字 不是规定范围 点击加减 会默认调账
- 当输入值 不等于 min + step 那么会调整为有效值
- -->
- <input type="number" step="2" max="20" min="9"> <br>
- <!--
- type:tel
- 输入电话号
- 在手机端能自己弹出拨号及那盘
- maxlength 输入最大长度
- -->
- tel:<input type="tel" maxlength="11"><br>
- <!--
- type:file
- 选择文件进行提交
- accept 属性 选择文件的类型
- -->
- file:<input type="file" accept="image/png"><br>
- <select name="" id="">
- <option value="1">1</option>
- <option value="2">2</option>
- </select><br>
- <input type="text" list="list1">
- <datalist id="list1">
- <option value="xiaoming" label="zhang"></option>
- <option value="xiaohong"></option>
- <option value="xiaoming" label="wang"></option>
- </datalist>
-
- <input type="submit">
- </form>
- </body>
- </html>
|
