html之为什么使用表单,常用表单元素使用?

发布时间:2023年12月25日


一、为什么使用表单呢?

为什么使用表单呢,使用表单是为了更好的收集用户数据,并且安全

二、常用表单元素使用

1、password密码框
密码框:会隐藏数据,以防给他人看见

<input type="password">

运行结果:
在这里插入图片描述

2、text文本框
文本框:定义用于文本输入的单行输入字段

<input type="text">

运行结果:
在这里插入图片描述

3、button普通按钮
普通按钮:普通按钮在form标签里会提交数据。此时普通按钮在form里面就会有提交的功能和提交按钮功能一样。

<input type="button">

运行结果:
在这里插入图片描述

4、submit提交按钮
提交按钮:提交表单的按钮

<input type="submit" value="提交">

运行结果:
在这里插入图片描述

5、file文件域
文件域:选择文件的地方

<input type="file">

运行结果:
在这里插入图片描述

7、checkbox复选框
复选框:可以多选

<input TYPE="checkbox">

运行结果:
在这里插入图片描述

8、radio单选按钮
checked默认选中
单选按钮:允许用户在有限数量的选项中选择其中之一

<input type="radio" checked>

运行结果:
在这里插入图片描述

9、textarea文本域
文本域:一般存放很多数据的

<textarea rows="" cols="每行中的字符数"" ></textarea>

运行结果:
在这里插入图片描述

10、select下拉框
selected为默认选中
下拉框:只能选择一项,但有多项可选

<select>
        <option>1</option>
        <option selected>2</option>
        <option>3</option>
    </select>

运行结果:
在这里插入图片描述

11、reset重置按钮
重置按钮:重置文件,重新输入

<input type="reset" value="重置">

运行结果:
在这里插入图片描述

12、number数字框
数字框:只能输入数字的框

<strong>数字框</strong>
<input type="number">

运行结果:
在这里插入图片描述

13、size长度宽度
长度宽度:设置文本框的宽度长度

<input type="text" size="长度">

运行结果:
在这里插入图片描述

三、总结

作用关键单词
文本框text
密码框password
普通按钮button
提交按钮submit
文件域file
重置按钮reset
数字框number
下拉框select option
下拉框默认选中selected
复选框checkbox
数字框最小min
数字框最大max
文本框最大输入maxlength
长度宽度size
文章来源:https://blog.csdn.net/weixin_72473547/article/details/135191916
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。