1.表单是用来收集用户填写的信息,可以说表单就是一个容器,里面的元素的类型可以不一样,所表示的功能也不同。

表单基本语法:

 <html>
<head>
<title>表单的基本语法</title>
</head> <body> 8 <form>
9 </form>
</body>
</html>

2.表单的两属性

action:表示表单提交后发送的URL地址,发送方式用method表示:可选参数有get/post,get传输量比较少,post传输量比较大

 <html>
<head>
<title>表单的基本语法</title>
</head> <body> 8 <form action= "show.aspx" method = "get">
9 <input type="text" >
10 <br>
11 <input type="password">
12 <br>
13 <input type="button" value="提交">
14 </form>
</body>
</html>

补充:<input>的语法中,完整语法为:

<input type="#">

这里#代码表示类型,可选项是:text,image,password,checkbox(复选框),radio(单选框),hidden(隐藏--密码),submit(提交),reset(重置)

3.

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>登录界面</title> </head> <body>
<h1>登录界面</h1>
<form action="" method="get">
用户名:<input type="text" name="username"/><br>
密&nbsp;&nbsp;码:<input type="password" name="pwd"/><br>
<input type="submit" value="登录"/><input type="reset"/>
</form>
</body>
</html>

4.

 名字:<input type = "text"  value = "请输入名字" name = "username"/> <br/>
密码:<input type = "password" name = "pwd"/> <br/>
***喜欢的水果***<br/>
<!-- name = "v1"这里name我们都是取v1,这是为了:将来链接服务器时候,提交的时 候比较方便-->
<input type = "checkbox" name = "v1"/> 西瓜 <br/>
<input type = "checkbox" name = "v1"/> 苹果 <br/>
<!-- name = "sex" 这里单选的表单之中,我们取名必须一样,不然会出现问题-->
***选择性别***<br/>
<input type = "radio" name = "sex"/> 男 <br/>
<input type = "radio" name = "sex"/> 女 <br/>
****隐藏(它的用途主要是:既可提交数据,同时不影响界面)<br/>
<input type = "hidden" value = "123" name = "salary"/> ****下拉选择框*****<br/>
请选择你的出生地:
<!-- 将来提交给网络远端数据库的时候,实际上提交的是像这里的name = "biradd"类 似的标号-->
<!-- 像刚刚开始option选项中没有属性value= **,这样的select控件携带的数据是不能 提交给远端服务器的,必须添加value-->
<select name = "biradd" >
<!--实际开发的时候我们还是经验上加:调节下拉框宽度-->
<option value = "">---请选择---</option> <option value = "beijing">北京</option>
<option value = "shanghai">上海</option>
<option value = "chongqing">重庆</option>
<select/><br/> ****请留言*****<br/>
<textarea cols = '30' rows = '10' >请这里输入…… </textarea><br/> ****请选择你要上传的文件*****<br/>
<input type = "file" name = "myfile"/>请选择文件

输出结果如下:

html笔记03:表单的更多相关文章

  1. And Design:拓荒笔记——Form表单

    And Design:拓荒笔记——Form表单 Form.create(options) Form.create()可以对包含Form表单的组件进行改造升级,会返回一个新的react组件. 经 For ...

  2. AngularJS 1.2.x 学习笔记(表单校验篇)

    https://my.oschina.net/cokolin/blog/526911 摘要: 本文首发于 blog.csdn.net/vipshop_ebs/article/details/39472 ...

  3. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  4. angular2 学习笔记 ( Form 表单 )

    refer : https://angular.cn/docs/ts/latest/guide/forms.html https://angular.cn/docs/ts/latest/cookboo ...

  5. vue学习笔记(六)表单输入绑定

    前言 在上一章vue学习笔记(四)事件处理器这一篇博客的内容中,我们已经了解vue是如何绑定事件的,而本篇博客主要讲解的是vue中表单输入的绑定,通常我们自己提交信息的时候都是通过表单将信息到服务器的 ...

  6. iOS开发笔记11:表单键盘遮挡、浮点数价格格式化显示、省市区选择器、View Debugging

    1.表单键盘遮挡 应用场景为一个collectionView上有多个textfield.textView供用户填写信息. 之前输入项较少时,采取的方法比较粗暴,didSelectItemAtIndex ...

  7. HTML5自学笔记[ 3 ]表单验证反馈

    表单控件对象的validity对象可以设置或返回相关的验证信息(在invalid事件处理中获取validity对象): 属性valid:为true所有验证通过,为False至少有一种验证失败. 属性v ...

  8. Symfony2学习笔记之表单

    对于一个Web开发者来说,处理HTML表单是一个最为普通又具挑战的任务.Symfony2集成了一个Form组件,让处理表单变的容易起来.在这一节里,我们将从基础开始创建一个复杂的表单,学习表单类库中最 ...

  9. Html笔记(七)表单

    表单标签: <form> 表单标签是最常用的标签,用于与服务器端的交互. <input>:输入标签:接受用户输入信息 其中type属性指定输入标签的类型 文本框 text:输入 ...

  10. [学习笔记]--Jfinal 表单提交附件

    近期.项目里面用到了Jfinal 里面的上传附件. Jfinal 的Controller 里面提供了一个 getFile系列方法提供文件上传. 我这里呢,是文件上传和表单參数一起提交. 页面类似下图: ...

随机推荐

  1. JavaEE5 Tutorial_JavaBean,JSTL

    <jsp:useBean id="beanName" class="fully_qualified_classname" scope="scop ...

  2. GCC4.8对new和delete的参数匹配新要求

    一段通信协议的代码,早年在GCC 4.4.VS2013下编译都挺好的,移植到GCC 4.8 ,为C++ 11做准备,在编译的时候发现问题 源代码省略后的版本如下: class Zerg_App_Fra ...

  3. MAC机常用快捷键整理表格

    MAC机常用快捷键整理表格 范围 快捷键 说明 图形   (Command 键)在某些 Apple 键盘上,此键也可能为标志()     Control (Control 键)     Alt Opt ...

  4. j2ee指导型框架或示例

    springside appfuse springfuse

  5. HTML5每日一练之input新增加的5种其他类型1种标签应用

    今天介绍input在HTML5中的最后5种类型,分别是:number,range,search,tel和color 注意:此种类型的input在Opera10+中效果为佳,Chrome中效果不是十分好 ...

  6. CodeForces 705B Spider Man (水题)

    题意:给定 n 个数,表示不同的环,然后把环拆成全是1,每次只能拆成两个,问你有多少次. 析:也不难,反正都要变成1,所以把所有的数都减1,再求和即可. 代码如下: #pragma comment(l ...

  7. C#学习笔记(五):泛型

    认识泛型 泛型使类型参数化,从而实现了算法上的代码重用. 同时由于去掉了转换中装箱和拆箱的操作,使用泛型还可以提高程序的运行速度. 我们先看看C#自带的使用了泛型的类: using System.Co ...

  8. [置顶] 文件和目录(二)--unix环境高级编程读书笔记

    在linux中,文件的相关信息都记录在stat这个结构体中,文件长度是记录在stat的st_size成员中.对于普通文件,其长度可以为0,目录的长度一般为1024的倍数,这与linux文件系统中blo ...

  9. [置顶] a+=1/a=+1/a-=1区别-c语言

    1.解释 a+=1/a=+1/a-=1 含义 a+=1 实质等于 a += 1,也就是等于 a = a + 1: a=+1 实质等于 a = +1:[因为运算符中没有=+,很多人误以为是 a =+ 1 ...

  10. sql的存储过程调用

    USE [ChangHong_612]GO/****** Object: StoredProcedure [dbo].[st_MES_GetCodeRule] Script Date: 09/10/2 ...