您的位置:首页 > 新闻 > 热点要闻 > HTML表单标签

HTML表单标签

2025/1/7 5:58:01 来源:https://blog.csdn.net/lv_soso/article/details/142316294  浏览:    关键词:HTML表单标签

HTML表单标签作用:收集用户信息,例如登录、注册、搜索等场景。

1. input标签

语法:<input  type="...">

input标签type属性值不同,则功能不同。

占位文本

作用:提示信息

<input  type="..."  placeholder="提示信息">

2. 单选框radio

单选radio需要通过name属性来分组。

<input type="radio" name="gender" checked>男
<input type="radio" name="gender">女

3.多选框checkbox

多选框也叫复选框,默认选中:checked。

<input type="checkbox" checked">内容

4. 上传文件file

默认情况下,文件上传表单控件只能上传一个文件,添加multiple属性可以实现文件多选功能。

<input type="file" multiple>

5. 下拉菜单

语法:标签:select嵌套option,select是下拉菜单整体,option是下拉菜单的每一项。

<select><option>北京</option><option>上海</option><option>广州</option><option>深圳</option><option selected>武汉</option>
</select>

6. 文本域

作用:多行输入文本的表单控件。

标签:<textarea>默认提示文字</textarea>

7. label标签

作用:网页中,某个标签的说明文本

增大点击范围:用label标签绑定文字和表单控件的关系,增大表单控件的点击范围。

  • 写法1:

label标签只包裹内容,不包裹表单控件。

设置label标签的for属性值和表单控件的id属性值相同。

<input type="radio" id="man"><label for="man">男</label>
  • 写法2:

使用label标签包裹文字和表单控件,不需要属性。

<label><input type="radio">女</label>

8. 按钮button标签

语法:<button type="">按钮</button>

type属性值:

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com