新增的表单

datalist

  1. datalist定义下拉列表提示框,子元素为option单标签
  2. 输入框和下拉列表提示框产生关联需要使用的input输入框的list属性和datalist的id属性一致
  3. datalist的option标签添加两个属性
  • value显示下拉列表每一项的提示内容
  • label对提示内容的描述

例:

<input type="text" list="mydata" placeholder="请输入商品名称">选项列表

<datalist id="mydata"><option label="10项" value="女鞋"> <option label="13项" value="文具"></datalist>

details

  1. 显示或者隐藏用户需求的补充描述
  2. summary标签是details的标题
  3. details里面可以是任何内容
  4. open属性添加在details上面可以直接展开详细描述,默认是折叠的

例:

<details><summary>玩具品牌</summary> <p> 澳贝 </p><p> 奥迪双钻 </p></details>

表单控件(type取值)

  1. number数字
  • <input type="number" min="1" max="10" value="1" step="2">
  1. range滑块
  • <input type="range" min="1" max="10" value="1">
  1. color取色器
  • <input type="color" value="#颜色代码">
  1. search搜索
  • <input type="search"/>
  1. 时间字段

可取的type值:
month(年月)
week(年周)
time(时分)

  • <input type="time" step="1800"/>
  1. 日期字段
  • <input type="date" min="最小可选时间" value="默认时间">
  1. email电子邮件(验证电子邮件,必须有@符号,而且前后有内容)
  2. url网络地址(必须有http://)

表单控件新增属性(input)

  1. min定义最小值
  2. max定义最大值
  3. step表示步长
  4. value默认值
  5. autofocus自动聚焦
  6. required设置必填项
  7. pattern验证正则表达式