<form></form>表单标签,用于用户交互
表单是可以把浏览者输入的数据传送到服务器端,这样就可以处理表单传过来的数据。
语法:<form method="传送方式" action="服务器文件"></form>
注意的是<form></form>是成对出现的
method:“get/post”是传送方式
action:是输入的数据被传送到的地方
表单中的标签
(1)<label></label>label标签
<label for="控件id名">文字</label>
一般后面加的input框的name值和for里内容相互呼应,label控件不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你用鼠标单击label标签内的文本,就会触发该控件并自动转跳到其所对应的表单控件上
2<input type="text/password/email" value="" name="" id="与label中的for相呼应" />
此标签随type的值变化而变化 value:文本框/按钮上的显示值
type=“text”为输入框 name:为文本框命名,以备后台程序ASP、PHP使用
type="password"为密码框
![](https://img.haomeiwen.com/i12314480/a34bd9576e675b2e.png)
<input type="email" id="email" placeholder="Enter email" />
type="email"为邮箱框
placeholder=""格式值,点击即消失
![](https://img.haomeiwen.com/i12314480/d4c960ebee31e387.png)
![](https://img.haomeiwen.com/i12314480/bfbb01fd14caa7cb.png)
<input type="submit/reset" value="提交/重置" name="" />
type="submit"为确认键/提交键
type="reset"为重置键
![](https://img.haomeiwen.com/i12314480/5c8706d4e3e595ca.png)
![](https://img.haomeiwen.com/i12314480/ad283afa598dd091.png)
<input type="radio/checkbox" value="值" name="名称" checked="checked" />
type="radio"为单选框
type="checkbox"为复选框
value:提交数据到服务器的值(后台PHP)
name:为控件命名,以备后台程序ASP、PHP使用 checked:设置为checked时视为该项默认选中
![](https://img.haomeiwen.com/i12314480/1db07c5193dfdfbb.png)
![](https://img.haomeiwen.com/i12314480/a9cf5054424fa2f4.png)
(3)<textarea rows="行数" cols="列数">文本</textarea>文本标签
rows:多行输入域的行数
cols:多行输入域的列数
其实就是设置textarea的高度和宽度
在后期css中,可用width和height来代替
width代替cols,height代替rows
![](https://img.haomeiwen.com/i12314480/766dbeeb46916868.png)
![](https://img.haomeiwen.com/i12314480/de23502d7ece7da4.png)
(4)<select><option value="值">文本</option><select>下拉列表框标签
通常来说value的值与文本相同,但值是向服务器提交的值,文本是显示给用户的
![](https://img.haomeiwen.com/i12314480/40df3548d198feda.png)
![](https://img.haomeiwen.com/i12314480/a02b30eedbfda231.png)
<select multiple="multiple"></select>
表示该下拉列表框可以多选(按住ctrl)
<option value="值" selected="selected"></option>
设置selected=“selected”属性,则该选项就默认选中
2018年5月24日08:22:40
网友评论