HTML表单部分功能汇总

一、占位符（placeholder）的使用

占位符，即用户在input输入框输入任何数据之前，输入框内显示的预定义文本。
直接看代码，一看就懂了

<input type="text">
<br/><br/>
<input type="text" placeholder="请输入内容">

运行结果

---

二、必填项（required）

要指定某些选项为必填项，不填用户将无法提交表单，

正常情况下

<form action="http://www.baidu.com">
    <input type="text" placeholder="请输入内容">
    <input type="submit" value="提交">
</form>

不输入任何内容，点击提交，页面将跳转到百度首页
、

当设置text属性为必填项后，代码如下

<form action="http://www.baidu.com">
    <input type="text" placeholder="请输入内容" required>
    <input type="submit" value="提交">
</form>

点击无内容点击提交

---

三、关于单选

1.列表内容

最普通的单选

<input type="radio" name="sex" value="male" />Male

只有点击“○”才会被选中

2.已被选中

<input type="radio" name="sex" value="male" checked/>Male

和1一样，只有点击“○”才有效果

3.点击文本，同样起效果
此时，就要用到一个<label>标签

<label>标签为 input 元素定义标注（标记）。
label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
再通俗点说，就是用户鼠标点击控件相关的文本，也会触发控件，让它选中或取消

  <!--一-->
    <label for="male">Male</label>
    <input type="radio" name="sex" id="male"/>
    <br /><br />
  <!--二-->
    <label><input type="radio" name="sex" value="male"/>Male</label>

对于一：<label> 标签的 for 属性应当与相关元素的 id 属性相同，因为”for” 属性可把 label 绑定到另外一个元素，也就是说，此时必须要有id与for属性相对应，不然不起作用，记住，如果按照第一种方法，必须要有id

结果，点击“Male”也会被选中

---

四、