HTML中最重要内容之一-表单

表单概述

表单的用处有很多随处可见,例如,在进行用户注册时,就必须通过表单来填写用户的相关信息。我们首先介绍表单的概念和用途,然后介绍<form>标签的属性及其含义。
表单:表单的主要功能是收集信息,具体来说是收集浏览者的信息。在网络中,最常见的表单形式主要包括 文本框、单选按钮、复选框、按钮等。

表单标签<form>

  • 基本的 其语法格式如下:
<form action=""name="" method=""target="">
 ....
 </form>
  • form表单中属性的值及其含义
form属性含义
action表单的处理程序,也就是表单收集到的资料将要提交的程序地址
name为了防止表单信息在提交到后台处理程序时出现混乱而设置的名称
method定义处理程序从表单中获得信息的方式,有get(默认值)和post两个值
enctype表单信息提交的编码方式。其属性值有 text/plain、application…
target目标窗口的打开方式
  • 单选按钮和复选框

在这里插入图片描述

如图可知:可以看出来单选按钮只能选择一个,而复选框可以多选择

        <!-- 单选按钮 -->
		<label> <input type="radio" name="all">全选</label>
		<label> <input type="radio" name="all">全不选</label>
		<!-- 复选框 -->
		复选框
		<input type="checkbox" class="checkbox1">
		<input type="checkbox" class="checkbox1">
		<input type="checkbox" class="checkbox1">
  • 单行文本框和密码输入框
  • 在这里插入图片描述
       <input type="text" placeholder="账号" > </label>		                                   
		 <input type="text" placeholder=" 密码" > </label>
			 <!-- /*password 密码  placeholder:占位符*/ -->
			 

文本域

在HTML中还有一种特殊定义的文本样式,称为文本域。它与文本框的区别在于可以添加多行文字,从而可以输入更多的文本。这类控件在一些留言板中最为常见。其语法如下:

<textarea= name="文本域名称" value="文本域默认值" rows="行数" cols="列数"><textarea>

在这里插入图片描述

菜单/列表

菜单列表类的控件主要用来选择给定答案中的一种,这类选择往往答案比较多,使用单选按钮比较浪费时间。可以说,菜单列表类的控件主要是为了节省空间而设计的,菜单和列表都是通过<select><option>标签来实现的。菜单是一种最节省空间的方式,正常状态下只能看到一个选项,单击按钮打开菜单后才能看到全部选项。

代码语法如下:

<select name=""size=""multiple="multiple">
	<option value=""selected="selected">选项显示内容</option>
	<option value="选项值">选项显示内容</option>
</select>

列表可以显示一定数量的选项,如果超出了这个数量,则会自动出现滚动条,浏览者可以通过拖动滚动条显示个选项。

在这里插入图片描述

菜单和列表标签属性

菜单和列表标签属性描述
name列表/菜单标签的名称,用于和页面中的其他控件加以区别
size定义列表/菜单文本框在页面中显示的长度
multiple表示列表/菜单内容可以多选
value用于定义列表/菜单的选项值
selected默认被选中
  • 4
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值