响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 例4-7 datalist

代码

doctype html>
<html>
<head>
<meta charset="utf-8">
<title>datalisttitle>
head>

<body>
<input id="address" list="addressList">
<datalist id="addressList">
  <option value="北京">option>
  <option value="上海">option>
  <option value="深圳">option>
datalist>
body>
html>

上述代码中,
第9行代码定义id值为address,list属性为addressList的input元素;
第10~14行代码定义id值为addressList的datalist元素,使得该元素与input元素绑定到一起。

运行效果

响应式Web开发项目教程(HTML5+CSS3+Bootstrap)第2版 例4-7 datalist_第1张图片
< datalist >标签用于定义输入域的选项列表,痛过id属性与< input >标签关联,用来配合定义< input >标签可能的值。列表通过< datalist >标签嵌套< option >标签来创建。

你可能感兴趣的:(html5,css3,前端)