<label>和<input>的作用

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

ihui老黑

2014-11-26 12:54

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

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

求指点

写回答 关注

2回答

  • 张焱森
    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 的文字,就能看到对比效果了。

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225309 学习 · 18230 问题

查看课程

相似问题