HTML表单元素是用于创建网页上用户输入数据和提交数据的界面，这些元素包括文本框、密码框、单选按钮、复选框、下拉列表等，本文将详细介绍各种HTML表单元素及其使用方法。
（图片来源网络，侵删）
1、文本框（input type="text"）
文本框是用于输入单行文本的控件，用户可以通过键盘输入文本，也可以使用鼠标点击文本框进行编辑，示例代码如下：
<form> <label for="username">用户名：</label> <input type="text" id="username" name="username" required> <br> <input type="submit" value="提交"> </form>
2、密码框（input type="password"）
密码框与文本框类似，但输入的文本会被隐藏显示为圆点或星号，这有助于保护用户的密码安全，示例代码如下：
<form> <label for="password">密码：</label> <input type="password" id="password" name="password" required> <br> <input type="submit" value="提交"> </form>
3、单选按钮（input type="radio"）
单选按钮允许用户从多个选项中选择一个，同一组内的单选按钮具有相同的name属性值，确保只能选择一个选项，示例代码如下：
<form> <p>请选择您的性别：</p> <input type="radio" id="male" name="gender" value="male" required> <label for="male">男</label> <input type="radio" id="female" name="gender" value="female"> <label for="female">女</label> <br> <input type="submit" value="提交"> </form>
4、复选框（input type="checkbox"）
复选框允许用户从多个选项中选择多个，每个复选框都有一个独立的name属性值，允许用户选择多个选项，示例代码如下：
<form> <p>请选择您喜欢的水果：</p> <input type="checkbox" id="apple" name="fruit" value="apple"> <label for="apple">苹果</label> <input type="checkbox" id="banana" name="fruit" value="banana"> <label for="banana">香蕉</label> <br> <input type="submit" value="提交"> </form>
5、下拉列表（select）
下拉列表允许用户从一个预定义的选项列表中选择一个选项，示例代码如下：
<form>
<label for="country">国家：</label>
<select id="country" name="country" required>
<option value="china">中国</option>
<option value="usa">美国</option>
<option value="uk">英国</option>
</select>
<br>
<input type="submit" value="提交">
</form>
6、文件上传（input type="file"）
文件上传控件允许用户选择一个本地文件并将其上传到服务器，示例代码如下：
<form action="/upload" method="post" enctype="multipart/formdata"> <label for="file">上传文件：</label> <input type="file" id="file" name="file" required> <br> <input type="submit" value="上传"> </form>
7、按钮（button）
按钮控件通常用于触发JavaScript函数或提交表单，示例代码如下：
<form> <button type="button" onclick="myFunction()">点击我</button> </form>
8、提交按钮（input type="submit"）
提交按钮用于将表单数据发送到服务器进行处理，示例代码如下：
<form action="/submit" method="post"> <input type="text" name="name" required> <input type="submit" value="提交"> </form>
9、重置按钮（input type="reset"）
重置按钮用于清除表单中的所有输入字段的值，示例代码如下：
<form> <input type="text" name="name" required> <input type="reset" value="重置"> <input type="submit" value="提交"> </form>
通过以上介绍，我们可以了解到HTML表单元素的种类和使用方法，在实际开发中，根据需求选择合适的表单元素，可以实现用户友好的数据输入和提交功能。