<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta name="author" content="" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link rel="stylesheet" type="text/css" href="" />
<style type="text/css"></style>
<script type="text/javascript"></script>
</head>
<table width="400" align="center" border="1">
<td>籍贯A</td>
<select name="jiguan"> <!--下拉列表框-->
<option value="bejing">北京</option>
<option value="heibei" selected="selected">河北</option>
<option value="shanghai">上海</option>
</select>
<td>籍贯B</td>
<select name="address"> <!--分组下拉列表框-->
<optgroup label="北京">
<option value="haidian">海淀</option>
<option value="dongcheng">东城</option>
<option value="xicheng">西城</option>
<option value="chaoyang">朝阳</option>
</optgroup>
<optgroup label="河北">
<option value="baodin">保定</option>
<option value="shijiazhuang">石家庄</option>
<option value="langfang">廊坊</option>
<option value="tangshan">唐山</option>
</optgroup>
</select>
<td>水果</td>
<select name="fruit" multiple="multiple" size="3"> <!--可以多选的下拉列表框-->
<option value="apple">苹果</option>
<option value="banana">香蕉</option>
<option value="pear">梨</option>
<option value="orange" selected="selected">桔子</option>
<option value="watermelon">西瓜</option>
<option value="strawberry">草莓</option>
</select>
</table>
</body>
</html>
new document 籍贯A 北京 河北 上海 籍贯B 海淀 东城 西城 朝阳
HTML 下拉选择用于在网页中提供一组可供用户选择的项目。使用下拉选择时,用户可以从列表中选择一个项目。可以在 HTML 表单中使用下拉选择。
要创建 HTML 下拉选择,需要使用 <select> 元素。在 <select> 元素内,可以使用 <option> 元素来定义可供选择的项目。
例如,以下代码片段创建了一个下拉选择,其中包含三个可供选择的项目:
用户名:<input type="text" id="username" name="username" />
注意:①、设置name属性通常用来将文本的数据提交给后台程序,或者是后台程序将数据回显到表格中
②、设置id属性 通常与<label></label>标签...
<div class="layui-form-item">
<label class="layui-form-label">下拉选择框</label>
<div class="layui-input-block">
<select name="select" lay-verify="required">
<option value="">请选择</option>
<option value="0">0</option>
<option value="2">2</option>
</select>
在这段代码中,`<select>`标签定义了一个下拉选择框,其中`<option>`标签定义了下拉列表中的选项。我们在这里定义了两个选项,分别是0和2,并将它们的值分别设置为"0"和"2"。在Layui中,我们使用`layui-form-item`类来创建一个表单项,`layui-form-label`类来设置表单项的标签,`layui-input-block`类来包含表单项的主体内容。此外,`lay-verify="required"`表示该下拉选择框为必填项,如果没有选择任何选项,将无法提交表单。