HTML14：列表框文本域和文件域

莓有烦恼

已于 2025-05-11 14:59:34 修改

阅读量470

点赞数 14

文章标签：前端服务器 javascript html5 html

于 2025-05-11 14:56:57 首次发布

本文链接：https://blog.csdn.net/2301_77129712/article/details/147873254

版权

列表框文本域和文件域

属性	说明
type	指定元素的类型。text、password、 checkbox、 radio、submit、reset、file、hidden、image 和button，默认为text
name	指定表单元素的名称
value	元素的初始值。type为radio时必须指定一个值
size	指定表单元素的初始宽度。当type为text 或password时，表单元素的大小以字符为单位。对于其他类型，宽度以像素为单位
maxlength	type为text或password时，输入的最大字符数
checked	type为text或password时，指定按钮是否是被选中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录注册</title>
</head>
<body>
<h1>注册</h1>
<!--表单form
action:表单提交的位置，可以是网站，也可以是一个请求处理地址
method:post,get提交方式
    get方式提交：我们可以在url中看到我们提交的信息，不安全，高效
    post:比较安全，传输大文件
-->
<form method="post" action="6.表格.html" >
<!--文本输入框
value="" 默认初始值
maxlength="8" 最长能写几个字符
size="30" 文本框的长度
-->
    <p>名字:<input type="text" name="username" maxlength="8" size="30"></p>
    <p>密码:<input type="password" name="pwd" maxlength="20" size="30"></p>
    <!--单选框标签
    input type="radio"
    value:单选框的值
    name：表示组
    -->
    <p>性别:
        <input type="radio" value="boy" name="sex" checked/>男
        <input type="radio" value="girl" name="sex"/>女
        <input type="radio" value="unknown" name="sex"/>未知
    </p>
    <!--多选框
    checked默认选中
    -->
    <p>爱好:
        <input type="checkbox" value="sleep" name="hobby">睡觉
        <input type="checkbox" value="code" name="hobby" checked>敲代码
        <input type="checkbox" value="chat" name="hobby">聊天
        <input type="checkbox" value="game" name="hobby">游戏
    </p>
    <!--
    input type="button" 普通按钮
    input type="image"  图像按钮
    input type="submit" 提交按钮
    input type="reset"  重置
    -->
    <p>按钮:
        <input type="button" name="btn1" value="点击V50"><br/>
    </p>
    <!--下拉框，列表框
    selected默认
    -->
    <p>地区:
        <select name="area">
            <option value="china" selected>中国</option>
            <option value="us">美国</option>
            <option value="eth">瑞士</option>
            <option value="India">印度</option>
        </select>
    </p>
    <!--文本域-->
    <p>反馈:
        <textarea name="textarea" cols="50" rows="10"></textarea>
    </p>
    <!--文件域
    input type="file"
    name="files"  属性
    -->
    <p>
        <input type="file" name="files">
        <input type="button" value="上传" name="upload">
    </p>
    <p>
        <input type="submit">
        <input type="reset" value="清空表单">
    </p>
</form>
</body>
</html>