当前位置 : 主页 > 网页制作 > html >

Web全栈-Label标签

来源:互联网 收集:自由互联 发布时间:2021-06-12
!DOCTYPE htmlhtml lang="en"head meta charset="UTF-8" titleLabel标签/title/headbody!--1.默认情况下文字和输入框是没有关联关系的, 也就是说点击文字输入框不会聚焦, 如果想点击文字时让对应的输入框聚
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Label标签</title>
</head>
<body>
<!--
1.默认情况下文字和输入框是没有关联关系的, 也就是说点击文字输入框不会聚焦, 如果想点击文字时让对应的输入框聚焦, 那么就需要让文字和输入框进行绑定

2.要想让输入框和文字绑定在一起, 那么我们可以使用Label标签

3.绑定的格式:
3.1将文字利用label标签包裹起来
3.2给输入框添加一个id属性
3.3在label标签中通过for属性和输入框中的id进行绑定即可
  <label for="account">账号:</label><input type="text" id="account">
-->
<form action="">
    <label for="account">账号:</label><input type="text" id="account"><br>
    <label for="pwd">密码:</label><input type="password" id="pwd"><br>

    <hr>
    <label>
        账号:<input type="text">
    </label><br>
    <hr>

    <label for="def">账号:</label><input type="text" id="abc"><br>
    <label for="abc">密码:</label><input type="password" id="def"><br>
</form>
</body>
</html>
网友评论