HTML表单元素详解-优快云博客

本文链接：https://blog.youkuaiyun.com/hlfsunshine/article/details/78169278

Form 表单

表单是一个包含表单元素的区域。主要作用就是向服务器提交数据。具体格式如下：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Form表单</title>
</head>
<body>
<form action="a.jsp" method="get">
里面是具体的表单内容
</form>
</body>
</html>

文本

1 文本框
2 密码框
3 文本域

<form action="a.jsp" method="get">
<table>
    <tr>
        <td>
        用户名：
        </td>
        <td>
        <input type="text" id="userName" name="userName"/>
        </td>
    </tr>
    <tr>
        <td>
        密码：
        </td>
        <td>
        <input type="password" id="pwd" name="pwd"/>
        </td>
    </tr>
    <tr>
        <td colspan="2">
            <textarea id="desc" name="desc" rows="10" cols="30"></textarea>
        </td>
    </tr>
</table>
<br/>

</form>

文本相关

单选框

name要一样，如果name不一样的话，就变成复选框了

性别：<input type="radio" name="sex" />男
<input type="radio" name="sex" checked="checked"/>女

复选框

name可以一样，当然name也可以不一样，都是复选

<input type="checkbox" name="hobby" />唱歌
<input type="checkbox" name="hobby" />跳舞
<input type="checkbox" name="hobby" checked="checked"/>游泳

下拉框

年级：
<select id="grade" name="grade">
    <option value="1">一年级</option>
    <option value="2">二年级</option>
    <option value="3">三年级</option>
</select>