我们在浏览网页时会常常碰着注册会员的界面，大概像这个样子：
或填写问卷的情形，大概像这个样子：
我们把这些内容称之为表单。
如何向自己的页面中添加表单呢？
添加表单的操作和添加表格类似。
首先我们要在页面中写入<form></form>标签，这是向浏览器声明这里是个表单，它本身并不会显示在页面中，但是可以全局掌握表单元素的一些属性，就像表格中的<table></table>标签。
然后再在<form></form>中写入<input/>标签，这个标签的内容就会显示在页面中了，就像表格元素中的<tr><td>标签。不同的是<input/>没有结尾标签。
下面让我们写一写。
首先复制"第一个页面.html"文件。改名为"表单.html"，然后清空<body></body>中的内容，将<head></head>中间的<title></title>中间的内容改为"表单"，这样方便我们查看测试页面。
示例代码如下：
<!DOCTYPE HTML> <html> <head> <title>表单 </title> </head> <body> </body> </html>
下面我们要写入表单内容，示例代码如下：
<form> <input/></form>
页面效果如下：
只有一个输入框。下面，我们为输入框添加名称"会员名称："，示例代码如下：
<form> 会员名称： <input/></form>
效果如下：
这样我们就写出了一个大略的表单，如果为表单添加更多内容和设置，就要连续理解表单的属性。
表单元素属性1
<input/>标签通过改变type属性可以变换出不同功能，在页面制作中，我认为<input/>标签中的type属性最主要。
下面我们来看一下type属性不同的值。
图片来源W3School
输入笔墨：首先，先来看text值。解释很明确，这个属性值的<input>标签紧张是用来输入文本，比如"会员名称。"
示例代码如下：
<form> 会员名称： <input type="text"/></form>
页面效果如图所示：我胡乱输入了几个字母
如果不指定type的text值的话，表面看起来并不影响输入内容，但是表单的内容终极是要提交到做事器的，如果不注明type="text"，做事器就不能判断你输入的字符到底是一段代码还是一段字符串组成的文本，因此，我们为了让提的交数据在做事器端能被准确识别，一定要写好type的属性。
除此之外变换type值也能为<input/>变换不同功能。
制作提交按钮：例如"submit"（提交）。在我们输入完表单内容后，一样平常都有一个提交按钮，这个提交按钮也是由<input/>标签来完成的。
示例代码如下：
<form> 会员名称： <input type="text"/> <input type="submit"/></form>
如图所示：
由于<input/>是内联元素，以是"submit"按钮会和之前的<input>显示在一行，换行的话很大略，可以利用<br>标签。
大家不雅观察一下创造，我们并没有给"submit"按钮指定笔墨，在按钮上却涌现了"提交查询"的字样，这是html默认的，如果我们要改变按钮笔墨就要利用value这个属性。示例代码如下：
<input type="submit" value = "提交"/>
页面效果如下：
实在我们在输入笔墨时，输入框里会常常有提示笔墨，当我们点击输入框时，提示笔墨消逝了，这个功能怎么实现？
这又涉及到一个新属性，叫做"placeholder"（提示笔墨）。
示例代码如下：
<input type="text" placeholder = "请输入英文或汉语拼音"/>
页面效果如下：
下面我们来练习一下，示例代码如下：
<form> 会员名称：<input type = "text" placeholder = "请输入英文或汉语拼音"/><br> 会员密码：<input type = "text" placeholder = "请输入英笔墨母、分外符号、数字"/><br> 确认密码：<input type = "text" /><br><input type = "submit" value = "提交"/><br></form>
页面效果如下：（想把密码字符显示为小圆点的读者可以先去属性值列表中找找"password"看看，咱们后面会细致讲解）
制作多选表单：多选表单的type属性值是"checkbox"。
我猜大家也猜到该怎么写了，示例代码如下：
<form> 兴趣爱好：<br> <input type = "checkbox" name="hobby" value = "reading"/>读书 <input type = "checkbox" name="hobby" value = "film"/>电影 <input type = "checkbox" name="hobby" value = "painting"/>绘画 <input type = "checkbox" name="hobby" value = "music"/>音乐 <br> <input type = "submit" value = "submit"/> </form>
页面效果如下：
大家可以点点试试，可以多选了。如图：
这时小伙伴们会创造在这组示例中，涌现了name和value两个属性。
先说value，在"submit"中，value的值也便是"提交"二字，是直接显示在按钮上的，而这里的value值却没有显示，显示出来的是我们在<input/>标签后面输入的"读书、电影、绘画、音乐"这样的字样。也便是说这里的value不会显示为选框的名字！
那value属性是干嘛的呢？实际上"checkbox"属性下的value属性值是写给后台的做事器看的。
我们向做事器提交选择后，做事器把name的名称作为数据的大类名称，把value值作为大类中的子类名称来存储或剖析数据。
比如这个选择表单是有关兴趣爱好的，因此数据的大类属于"爱好"（hobby），即name="hobby"，hobby中又分为"reading"（读书），"film"（电影），"painting"（绘画），"music"（音乐），即value="reading"、value="film"等等。这样不同用户的不同选择就按照这个数据组织办法提交给了做事器。
大家明白了吗？
其余须要解释的是，name和value最好利用英文或拼音来书写！
虽然我们目前不涉及后端做事器上的操作，但是在学习时要养成规范书写的习气。
实在，除了type="submit"的情形外，其他须要输入信息的type属性类型都是要写name属性的，不过不同type属性类型的value却不太一样。
下面我们来看看type="text"时的标准写法：当type="text"的时候，不必写value属性，由于value值为用户输入的内容
<form> 会员名称： <input type = "text" placeholder = "请输入英文或汉语拼音" name="memberName"/><br> 会员密码： <input type = "text" placeholder = "请输入英笔墨母、分外符号、数字" name="passWord"/><br> 确认密码：<input type = "text" name="confirmPassWord"/><br> <input type = "submit" value = "提交"/><br></form>
本日的内容先到这里，我们来日诰日连续讲解"表单元素"。
喜好的小伙伴请关注和转发，阅读中碰着任何问题请给我留言，如有疏漏或缺点欢迎大家斧正，不胜感激！
HTML序章（学习目的、工具、基本观点）——零根本自学网页制作
HTML是什么？——零根本自学网页制作
第一个HTML页面如何写？——零根本自学网页制作
HTML页面中head标签有啥用？——零根本自学网页制作
初识meta标签与SEO——零根本自学网页制作
HTML中的元素利用方法1——零根本自学网页制作
HTML中的元素利用方法2——零根本自学网页制作
HTML元素中的属性1——零根本自学网页制作
HTML元素中的属性2（路径详解）——零根本自学网页制作
利用HTML添加表格1（基本元素）——零根本自学网页制作
利用HTML添加表格2（表格头部与脚部）——零根本自学网页制作
利用HTML添加表格3（间距与颜色）——零根本自学网页制作
利用HTML添加表格4（行颜色与表格嵌套）——零根本自学网页制作
16进制颜色表示与RGB色彩模型——零根本自学网页制作
HTML中的块级元素与内联元素——零根本自学网页制作
初识HTML中的<div>块元素——零根本自学网页制作
在HTML页面中嵌入其他页面的方法——零根本自学网页制作
封闭在家学网页制作！
为页面嵌入PDF文件——零根本自学网页制作
HTML表单元素初识1——零根本自学网页制作
HTML表单元素初识2——零根本自学网页制作
HTML表单3（下拉列表、多行笔墨输入）——零根本自学网页制作
HTML表单4（form的action、method属性）——零根本自学网页制作
HTML列表制作讲解——零根本自学网页制作
为HTML页面添加视频、音频的方法——零根本自学网页制作
音视频格式转换神器与html视频元素加字幕——零根本自学网页制作
HTML中利用<a>标签实现文本内链接——零根本自学网页制作
