HTML笔记:下拉列表

  在网页设计时经常会用到下拉列表,它既可以单选,也可以多选;

语法:
1、value
<option value = '提交值'> 选项 </option>

2、selected = “selected” 设置selected = "selected" 属性,则该选项就会被默认选中。

示例:
<option value = '提交值' selected="selected"> 选项 </option>

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>下拉列表框</title>
</head>
<body>
<form action="save.php" method="post" >
    <label>爱好:</label>
    <select>
      <option value="看书">看书</option>
      <option value="旅游" selected="selected">旅游</option>
      <option value="运动">运动</option>
      <option value="购物">购物</option>
    </select>
</form>
</body>
</html>

下拉列表多选
下拉列表也可以进行多选操作,在<select>标签中设置multiple="multiple"属性,就可以实现多选功能,在 windows 操作系统下,进行多选时按下Ctrl键同时进行单击(在 Mac下使用 Command +单击),可以选择多个选项;

示例:

<label>爱好</label>
<selected multiple="multiple">
<option value = '提交值' selected="selected"> 选项 </option>
<option value = '提交值' selected="selected"> 选项 </option>
<option value = '提交值' selected="selected"> 选项 </option>
<option value = '提交值' selected="selected"> 选项 </option>
</selected>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>使用下拉列表框进行多选</title>
</head>
<body>
<form action="save.php" method="post" >
    <label>爱好:</label>
    <select multile="multile">
      <option value="看书">看书</option>
      <option value="旅游">旅游</option>
      <option value="运动">运动</option>
      <option value="购物">购物</option>
    </select>
</form>
</body>
</html>
最后修改:2019 年 09 月 18 日 04 : 48 PM
您的支持就是我持续更新的动力!

发表评论

为了博客更好地生产内容,请将本站加入广告屏蔽插件的白名单,感谢您的支持。 具体方法
X