表单标签-表单项

最新推荐文章于 2024-09-29 12:06:46 发布

冰逸.itbignyi

最新推荐文章于 2024-09-29 12:06:46 发布

阅读量62

点赞数 1

分类专栏： javaWeb 前端文章标签： java 前端 html

本文链接：https://blog.csdn.net/jbykmzls/article/details/132502144

版权

javaWeb 同时被 2 个专栏收录

32 篇文章 0 订阅

订阅专栏

前端

12 篇文章 0 订阅

订阅专栏

<input>：表单项，通过type属性控制输入形式

type取值

text 默认值，定义单行的输入字段

password 定义密码字段

radio 定义单选按钮

checkbox 定义复选框

file 定义文件上传按钮

date/time/datetime-local 定义日期/时间/日期时间

number 定义数字输入框

email 定义邮件输入框

hidden 定义隐藏域

submit/reset/buttle 定义提交按钮/重置按钮/可点击按钮

<select>：定义下拉列表，<option>定义列表项

<textarea>：文本域

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>填写表单</title>
</head>
<body>
    <form action="" method="post">
        姓名：<input type="text" name="name"><br><br>
        密码：<input type="password" name="password"><br><br>
        性别：<label><input type="radio" name="gender" value="1">男</label>
            <label><input type="radio" name="gender" value="2">女</label><br><br>
        爱好：<label><input type="checkbox" name="hobby" value="java">java</label>
             <label><input type="checkbox" name="hobby" value="game">game</label>
            <label><input type="checkbox" name="hobby" value="ctrl">ctrl</label><br><br>
        图像：<input type="file" name="image"><br><br>
        生日：<input type="date" name="birhtday" ><br><br>
        时间：<input type="time" name="time"><br><br>
        日期时间：<input type="datetime" name="datetime"><br><br>
        邮箱: <input type="email" name="email" ><br><br>
        年龄：<input type="number" name="age"><br><br>
        学历：<select name="degree">
                <option value="">-------请选择--------</option>
                <option value="1">大专</option>
                <option value="2">本科</option>
                <option value="3">硕士</option>
                <option value="4">博士</option>
        </select><br><br>
        描述：<textarea name="description" cols="30" rows="10"></textarea>
        <input type="hidden" name="id" value="1">
        <!-- 常见按钮 -->
        <input type="button" value="按钮">
        <input type="reset" value="重置">
        <input type="submit" value="提交">
        <br><br>
    </form>
</body>
</html>