<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>form</title>
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
<fieldset>
<legend>表单</legend>
<label>姓名:<input type="text" id="name" name="name"></label>
<br>
<label>年龄:<input type="text" id="age" name="age" value="27"></label>
</fieldset>
<hr>
<label>文本域:<textarea name="textarea" id="textarea" cols="30" rows="10">文本域默认值</textarea></label>
<hr>
<label>单选
<select name="category">
<option value="new" selected>新闻</option>
<option value="game">游戏</option>
</select>
</label>
<hr>
<label>多选
<select name="category[]" multiple>
<option value="new">新闻</option>
<option value="game" selected>游戏</option>
</select>
</label>
<hr>
<label>分组
<select name="category">
<optgroup label="新闻">
<option value="new">新闻</option>
<option value="game" selected>游戏</option>
</optgroup>
<optgroup label="研发">
<option value="mysql">mysql</option>
<option value="go" selected>go</option>
</optgroup>
</select>
</label>
<hr>
单选框:
<label>男<input type="radio" name="sex" value="boy" checked></label>
<label>女<input type="radio" name="sex" value="girl"></label>
<hr>
复选框:
<label>手机<input type="checkbox" name="user[]" value="mobile" checked></label>
<label>邮箱<input type="checkbox" name="user[]" value="email"></label>
<hr>
文件上传:
<label><input type="file" name="file[]" multiple="multiple" accept=".png"></label>
<hr>
日期选择器:
<label><input type="date" step="5" min="2021-01-01" max="2028-12-31" name="date"></label>
<hr>
datalist:
<label>
<input type="search" name="search" list="lesson" autocomplete="on">
<datalist id="lesson">
<option value="mysql"></option>
<option value="go"></option>
<option value="html">html语言</option>
</datalist>
</label>
<hr>
有序列表:
<ol>
<li>吃饭</li>
<li>睡觉</li>
<li>打豆豆</li>
</ol>
<hr>
无序列表:
<ul>
<li>吃饭</li>
<li>睡觉</li>
<li>打豆豆</li>
</ul>
<hr>
描述列表:
<dl>
<dt>生活</dt>
<dd>吃饭</dd>
<dd>睡觉</dd>
<dd>打豆豆</dd>
<dt>学习</dt>
<dd>go</dd>
<dd>html</dd>
<dd>css</dd>
</dl>
<hr>
<button type="submit">提交表单</button>
</form>
</body>
</html>
.JPG)
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· 葡萄城 AI 搜索升级：DeepSeek 加持，客户体验更智能
· 什么是nginx的强缓存和协商缓存
· 一文读懂知识蒸馏