自学前端Day2

表单

• 表单域：一个包含所有表单控件和提示信息的框
• 表单控件/元素：男/女、是/否…
• 提示信息：姓名、年龄等
  

表单控件/元素

input

单标签，根据type属性值的不同来指定不同的控件类型：

radio&checkbox

      男： 女：

      爱好：篮球  游泳  网球

在前面的图片中可以看到，radio明明是单选按钮可是男和女都能选，解决办法是在input标签中添加一个name属性，并指定相同的值，这样就只能选一个了：

男： 女：

此外，input还有其它属性值：

代码如下：

     用户名

     密码

     男： 女：

     爱好：篮球  游泳  网球

其中，name、value作用是给后台用的，你在姓名输入了文本，后台怎么知道哪个text是姓名的文本？就是用name来标识；value也是，选择了性别，要在相应的input标签中写入对应的值以便后台知道(在text中value是前端可以看见的)。
单选与复选框可以设置checked属性，目的是页面加载时就默认选中一项(比如说有的页面自动给你勾选同意什么什么协议)，但要注意单选按钮是多选一，所以只能给其中一个加checked，但复选框可以选多个。
maxlength是指输入字段中能输入的最大长度。

submit

将form中的表单元素里面的值提交至服务器，按钮上的文字由value决定。

reset

点击后可以恢复至form初始的样子

button

一个普通的按钮，一般和js搭配使用(例如发送短信验证码)

label

经常和input配合使用，前面在选比如说性别时，只有将鼠标放到那个小圆圈里才能选，label可以使鼠标放在男/女文字上也可以选，增加用户体验。

男:
女:

效果如下，现在直接点击男/女就能选了

下拉表单 select

文本域 textarea

当输入留言或评论时，可以用。