表单标签-input控件、label标签、文本域、下拉列表和form表单域

本文详细介绍了HTML中的表单元素,包括input控件及其常用属性,label标签及其作用,textarea文本域的使用,select下拉列表的创建,以及form表单域的定义和属性,旨在帮助理解如何在网页中构建和管理用户交互表单。

表单标签

作用:1.为了收集用户信息。
     2.在网页中,跟用户进行交互,收集用户资料

在HTML中,一个完整的表单通常由表单控件(也称为表单元素)、提示信息和表单域3个部分构成。

表单控件:包含了具体的表单功能项,如单行文本输入框、密码输入框、复选框、提交按钮、重置按钮等。
提示信息:—个表单中通常还需要包含一些说明性的文字,提示用户进行填写和操作。
表单域:相当于一个容器,用来容纳所有的表单控件和提示信息,可以通过他定义处理表单数据所用程序的url地址,以及数据提交到服务器的方法。如果不定义表单域,表单中的数据就无法传送到后台服务器。

input控件:

  • 语法:<input type="属性值" value="内容">
  • 常用属性

  • input属性
属性说明作用
type表单类型用来指定不同的控件类型
value表单值表单里面默认显示的文本
name表单名字name主要作用就是用于区别不同的表单
checked默认选中表示那个单选或者复选按钮一开始就被选中

label标签

  • 概念:label标签为input元素定义标签
  • 作用:用于绑定一个表单元素,当点击label标签的时候,被绑定的表单元素就会获得焦点

textarea控件(文本域)

作用:1.创建多行文本输入框
     2.cols=“每行中的字符数” rows=“显示的行数”

固定文本域大小:resize:none;

select下拉列表:
语法:

   <select>
       <option>选项1</option>
       <option>选项2</option>
       <option>选项3</option>
   </select>
注意:1.<select>中至少包含一对<option>
     2.在option中定义select="selected"时,这个option就是默认选项
     3.实际开发应用比较少

form表单域:

  • 目的:在HTML中,from标签被用于定义表单域,以实现用户信息的收集和传递,form中的所有内容都会被提交给服务器。
  • 语法:
   <form action="url地址" method="提交方式" name="表单名称">
       表单控件
   </form>
  • 常用属性:
属性属性值作用
actionurl地址用于指定接收并处理表单数据的服务器程序的url地址
methodget/post用于设置表单数据的提交方式,其取值为get或post
name名称用于指定表单的名称,以区分同一个页面的多个表单
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值