html常见的表单元素有哪些,html表单元素有哪些?

HTML中常用的表单元素包括:文本区域(TEXTAREA),列表框(SELECT),文本输入框(INPUT type=text),密码输入框(INPUT type=password),单选输入框(INPUT type=radio),复选输入框(INPUT type=checkbox),重置按钮、提交按钮、隐藏域、等等。

一、文本域

二、密码域

密码跟文本框类似,但是在里面输入的内容显示为圆点。

三、单选按钮

男人: Male

女人: Female

四、复选框

五、按钮

六、重置按钮

当点击重置按钮时,重置按钮所在的表单将全部清空,而其他表单不受影响。

七、提交按钮

当点击提交按钮时,浏览器将自动提交表单。

八、隐藏域

隐藏域在浏览器中并不显示,仅仅为保存一些不太重要的资料而存在。

九、上传域

十、图片按钮

十一、下拉列表

0

1

2

例如:

属性:disabled,可选值:disabled ,说明:规定禁用该下拉列表。

十二、label

abel 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。例如,当将单选按钮放在label内。则点击label内的文字也会触发单选按钮,而不必只是点中小圆点。

例如:

男人

女人

十三、禁用(disabled)与只读(readonly)

禁用和只读属性。readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去。

禁用文本框:

只读文本框:

十四、TextArea

十五、fieldset 定义域

fieldset用于给表单元素分组,legend用于设置分组标题。

表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分: 表单标签,这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。表单域,包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮,包括提交按钮、复位按钮和一般按钮;用于将数据传送到服务器上的CGI脚本或者取消输入,还可以用表单按钮来控制其他定义了处理脚本的处理工作。

相关推荐
李明卫杭州1 分钟前
CSS `clamp()` 函数详解
javascript
奶丝兔蜜柚6 分钟前
栈溢出优化
javascript
南半球与北海道#12 分钟前
前端引入vue-super-flow流程图插件
前端·vue.js·流程图
然我18 分钟前
React 16.8:不止 Hooks 那么简单,这才是真正的划时代更新 🚀
前端·react.js·前端框架
小高00732 分钟前
📈前端图片压缩实战:体积直降 80%,LCP 提升 2 倍
前端·javascript·面试
OEC小胖胖35 分钟前
【React Hooks】封装的艺术:如何编写高质量的 React 自-定义 Hooks
前端·react.js·前端框架·web
BillKu43 分钟前
vue3+element-plus 输入框el-input设置背景颜色和字体颜色,样式效果等同于不可编辑的效果
前端·javascript·vue.js
惊悚的毛毛虫1 小时前
掘金免广告?不想看理财交流圈?不想看exp+8?
前端
springfe01011 小时前
vue3组件 - 大文件上传
前端·vue.js
再学一点就睡1 小时前
Vite 工作原理(简易版)—— 从代码看核心逻辑
前端·vite