HTML——72. 下拉列表分组(下拉列表中多选)

html 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>下拉列表分组</title>
	</head>
	<body>
		<!--select:
			1.表示创建下拉列表
			2.size属性设置列表中显示多少个列表项
			3.multiple属性可以定义下拉分组多选
			4.多选时,name属性值后应加上"[]",数组新式,发到服务器以遍历数组的方式发送过来
		
		option:
			1.表示每一个下拉列表项
			2.往服务器中发送的是value值
		
		optgroup:
			1.用来对option(对下拉表中的内容进行分组)进行分组
			2.label属性设置分组名称
		-->
		
		<form action="http://127.0.0.1/520ww1.php" method="post">
			到过的省市:<br />
			<select name="abc[]" size="3" multiple style="width: 200px;height: 150px;">
				<optgroup label="东北">
					<option value="a">辽宁</option>
					<option value="b">吉林</option>
					<option value="c">黑龙江</option>	
				</optgroup>
				<optgroup label="西南">
					<option value="d">四川</option>
					<option value="e">云南</option>
					<option value="f">贵州</option>	
				</optgroup>
			</select>
			<input type="submit" value="提交"/>
		</form>
		
		
		
		
		
	</body>
</html>


相关推荐
Revio Lab1 天前
把 AI 生成的 HTML 当 Markdown 来管:Web-Doc 自托管文档站实践
前端·html·mcp·html文档
之歆1 天前
DAY_14JavaScript DOM 进阶:HTML DOM 接口、事件监听与经典交互实战
开发语言·前端·javascript·html·ecmascript·交互
ZC跨境爬虫1 天前
跟着 MDN 学 HTML day_64:从 object 到 iframe 的嵌入技术全面解析
开发语言·前端·javascript·ui·html·音视频
布兰妮甜1 天前
前端规范:Bootstrap 模态框标准结构 + 无障碍适配最佳实践(可直接复用)
bootstrap·html·模态框·前端规范·无障碍适配
ZC跨境爬虫1 天前
跟着 MDN 学 HTML day_63:(Web 中矢量图形的完整指南)
前端·javascript·数据库·ui·html
2601_958492552 天前
Optimizing Engagement with Freehead Skate - HTML5 Game - Construct 3
前端·html·html5
ZC跨境爬虫2 天前
跟着 MDN 学 HTML day_61:(构建反馈表单的结构化挑战)
前端·javascript·ui·html·音视频
软件开发技术深度爱好者2 天前
HTML实现DOCX文档版题库图文考试系统(修订)
前端·javascript·html
爱学习 爱分享2 天前
微信小程序html 在 webview 会打开再缩放一下
微信小程序·小程序·html
ZC跨境爬虫2 天前
跟着 MDN 学 HTML day_62:(HTML调试与常见错误修复指南)
java·前端·javascript·ui·html·媒体