多种实例解析HTML表单form的使用方法

2020-04-16 08:39:18易采站长站整理

        </form>  
    </body>  
</html>  
  

浏览器效果:

9 表单中label标签

label标签不会向用户呈现任何特殊效果,它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本,就会触发此控件。就是说,当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上(就自动选中和该label标签相关连的表单控件上)。
语法:

<label for="控件id名称">

注意:标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。

XML/HTML Code复制内容到剪贴板

<!DOCTYPE HTML>  
<html>  
    <head>  
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
        <title>form中的lable标签</title>  
    </head>  
  
    <body>  
        <form>  
            <label for="male">男</label>    
                <input type="radio" name="gender" id="male" /><br />  
            <label for="female">女</label>    
                <input type="radio" name="gender" id="female" /> <br />  
            <label for="email">输入你的邮箱地址</label>    
                <input type="email" id="email" placeholder="Enter email"><br>  
  
            你对什么运动感兴趣:<br>  
            <label for="run">慢跑</label>