标签定义及使用说明
<select> 元素用来创建下拉列表。
<select> 元素中的 <option> 标签定义了列表中的可用选项。
提示:<select> 元素是一种表单控件,可用于在表单中接受用户输入。
举例:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>select标签</title> </head> <body> <form> 请选择学习科目: <select name="科目"> <option> --请选择-- </option> <option> Python </option> <option> Java </option> <option> Hadoop </option> <option> Spark </option> <option> Linux </option> <option> NoSQL </option> </select> <input type="submit" value="提交"> </form> </body> </html>
Google浏览器中操作:
select标签中的属性
属性 | 值 | 描述 |
---|---|---|
autofocus |
autofocus | 规定在页面加载时下拉列表自动获得焦点。 |
disabled | disabled | 当该属性为 true 时,会禁用下拉列表。 |
form |
form_id | 定义 select 字段所属的一个或多个表单。 |
multiple | multiple | 当该属性为 true 时,可选择多个选项。 |
name | name | 定义下拉列表的名称。 |
required |
required | 规定用户在提交表单前必须选择一个下拉列表中的选项。 |
size | number | 规定下拉列表中可见选项的数目。 |
option标签
<option> 标签定义下拉列表中的一个选项(一个条目)。
<option> 标签中的内容作为 <select> 或者<datalist> 一个元素使用。
属性
属性 | 值 | 描述 |
---|---|---|
disabled | disabled | 规定此选项应在首次加载时被禁用。 |
label | text | 定义当使用 <optgroup> 时所使用的标注。 |
selected | selected | 规定选项(在首次显示在列表中时)表现为选中状态。 |
value | text | 定义送往服务器的选项值。 |
案例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>option标签</title> </head> <body> <form> 请选择学习科目: <select name="科目"> <option value=""> --请选择-- </option> <option value="Python"> Python </option> <option value="Java"> Java </option> <option value="Hadoop"> Hadoop </option> <option value="Spark"> Spark </option> <option value="Linux"> Linux </option> <option value="NoSQL"> NoSQL </option> </select> <input type="submit" value="提交"> </form> </body> </html>