问答详情
源自:6-2 先来填用户名和密码 - 文本输入框、密码输入框

<label>和<input>的作用

我想问:
为什么要使用<label>啊?他的作用是什么?

因为不用<label>只用<input>都可以做到文本输入的效果啊?

求指点

提问者:ihui老黑 2014-11-26 12:54

个回答

  • 张焱森
    2014-11-26 13:22:51

    倒数第四行的 加入=假如,没修改回复权限,在此更正一下。另外 【实际效果】四个字加了链接,样式不明显。

  • 张焱森
    2014-11-26 13:20:23

    <form>  
          <label for="male">Male</label>
          <input type="radio" name="sex" id="male" />
          <br />  
          <label for="female">Female</label>
          <input type="radio" name="sex" id="female" />
    </form>

    先看代码,实际效果

    下面开始解释:label标签不是你说的文本输入标签,而是用来显示内容的,和span、p标签类似,用于显示内容,通常 label 标签和 input 标签在 form 表单中配合使用,提高用户体验。

    <label for="male">Male</label>
    <input type="radio" name="sex" id="male" />

    注意 label 有个 for 属性,值为其后的 input 标签的id值,在实际效果中可以看到,单击 label 内的文字会选中其后的 input。加入你删除第一个 label 的 for 属性,即:

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

    之后点击【提交代码】,试着点击右边上下 label 的文字,就能看到对比效果了。