HTML学习笔记chap4

本文详细介绍了HTML表单的基本标签,包括<form>, <input>, <textarea>, <select>等,并讲解了表单的基本属性如action、method、enctype等,还提到了如何插入表单对象及各种类型的输入控件,最后通过创建注册类表面单页实例加深理解。" 79182391,5535079,解决npm安装过程中的常见问题,"['npm', '网络问题', 'node-sass']

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

表单的基本标签

表单中所有字段都要写在如下标签中,定义整个表单;action指定提交这个表单是执行处理程序。当用户提交表单时,服务器会根据action指定的程序处理表单内容。

传递方式有get和post

<form action="执行程序地址" method="传递方式"> </form>

<input>标签

<input type="类型" name="名称" value="取值">

type可以选择如下类型:text文本框、button按钮、Checkbox复选框、radio单选框、hidden隐藏域、image图片、password密码输入框、submit提交按钮、reset重置按钮、file文件域 ;name表示表单元素的名称,一般要指明name属性,value为表单元素的默认值。 

<textarea>定义多行文本输入控件,文本区可容纳无限数量的文本,默认字体是等宽字体。可通过rows和cols来规定<textarea>尺寸 

<textarea name="名称" cols="列数" row="行数" wrap="换行方式">文本内容</textarea>

<select>标签生成列表

<select multiple size="可见选项数">
<option value="值"> </option>
</select>

 表单基本属性

action属性:指定表单提交到哪个地址进行处理

<form action="处理程序">...</form>

name属性:不是必须的,只是为了区别提交到后台的表单,以免出现混乱,设置属性时不能有空格或者特殊符号

<form name="表单名称">.....</form>

method属性:指定表单中数据提交到服务器时使用的HTTP,取值可以是get或者post.区别:post传送是表单数据包含在表单主题中,然后被送到处理程序上。get的传送方法是表单数据被传送到action属性指定的URL,然后这个新的URL被送到处理程序上

<form method="传送方式">....</form>

enctype属性:设置表单信息提交的编码方式,默认为url-encoded

<form enctype="编码方式">...</form>

target属性:指定目标窗口的打开方式,有_top._blank._parent._self

<form target="窗口打开方式">...<form>

插入表单对象 

文本域:访问者自己输入内容的表单对象,如姓名、地址等。语法如下:

<input name="空间名称" type="text" value="字段默认值 size="控件长度" maxlength="最长字符数">

type:用来指定插入哪个表单元素   name:文字字段的名称   value:用来定义文本框的默认值 size:义字符为单位确认文本框在页面显示的长度 maxlength:设定最多可以输入的字符数

密码域:一种特殊的文字字段,密码在输入时字符通常是不可见的,确保安全

<input name="控件名称" type="text" value="字段默认值" size="控件的长度" maxlegth="最长字符数">

普通按钮:可以单击的按钮,button一般情况下需要配合脚本进行表单处理

<input name="按钮名称" type="button" value="按钮的值" onclick="处理程序">

value的值为显示在按钮上的文字

单选按钮:圆形小按钮,为用户提供可选择选项

<input name="按钮名称" type="radio" value="按钮的值" checked/>

复选框:可以让用户选择多个选项

<input name="复选框名称" type="checkbox" value="复选框的值" checked/>

提交按钮:把用户在表单中的信息进行提交 

<input name="按钮名称" type="submit" value="按钮名称"/>

重置按钮:清除用户在页面上输入的信息

<input name="按钮名称" type="reset" value="按钮名称"/>

图像按钮:为按钮添加图像,更美观

<input name="按钮名称" type="image" src="图像路径" />

隐藏域:在传送数据时需要对用户不可见,需要用hidden属性进行隐藏

<input name="名称" type="hidden" value="取值"/>

文件域:上传文件或者给表单添加图片时会用到

<input name="名称" type="file" size="控件长度" maxlength="最长字符数"/>

 菜单和列表:下拉菜单可以节省空间,下拉菜单宽度是由最长的字符串表示的。相禁用某一个项目但是又想显示,用disabled属性。

<select name="下拉菜单名称">
<option value="选项值" selected>下拉菜单内容

</select>

列表项: 把所有选项都罗列出来,如果size过小的话,会出现滚动条,拖动滚动条就可以显示所有内容。

创建一个注册类表面单页(敲程序)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值