• <label>标签for属性的妙用


    在用户注册的时候,常常用户点击文字就需要将光标聚焦到对应的表单上面,这个是怎么实现的呢?就是下面我要介绍的<label>标签的for属性

    定义:for 属性规定 label 与哪个表单元素绑定

    1. <!--  
    2. 显式的联系:  
    3. <label for="SSN">Social Security Number:</label>  
    4. <input type="text" name="SocSecNum" id="SSn" />  
    5.   
    6. 隐式的联系:  
    7. <label>Date of Birth: <input type="text" name="DofB" /></label>  
    8. -->    


    下面是例子:

      1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
      2. <html xmlns="http://www.w3.org/1999/xhtml">  
      3. <head>  
      4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
      5.   
      6. <title>无标题文档</title>  
      7. </head>  
      8. <body>  
      9.       
      10.     <table>  
      11.         <tr>  
      12.             <td><label for="username">用户名:</label></td>  
      13.             <td><input type="text" name="username" id="username"></td>  
      14.         </tr>  
      15.         <tr>  
      16.             <td><label for="password">密码:</label></td>  
      17.             <td><input type="password" name="password" id="password"></td>  
      18.         </tr>  
      19.         <tr>  
      20.             <td><label for="repassword">密码确认:</label></td>  
      21.             <td><input type="password" name="repassword" id="repassword"></td>  
      22.         </tr>  
      23.         <tr>  
      24.             <td><label for="_basketball">爱好:</label></td>  
      25.             <td>  
      26.                 <label><input type="checkbox" value="basketball" name="hobby" id="_basketball">basketball</label>  
      27.                 <label><input type="checkbox" value="football" name="hobby" id="_football">football</label>  
      28.                 <label><input type="checkbox" value="skating" name="hobby" id="_skating">skating</label>  
      29.                 <label><input type="checkbox" value="dance" name="hobby" id="_dance">dance</label>  
      30.             </td>  
      31.         </tr>  
      32.         <tr>  
      33.             <td><label for="_boy">性别:</label></td>  
      34.             <td>  
      35.                 <label><input type="radio" value="boy" name="sex" id="_boy">boy</label>  
      36.                 <label><input type="radio" value="girl" name="sex">girl</label>  
      37.             </td>  
      38.         </tr>  
      39.         <tr>  
      40.             <td><label for="email">邮箱:<label></td>  
      41.             <td><input type="text" name="email" id="email"></td>  
      42.         </tr>  
      43.         <tr>  
      44.             <td><label for="address">住址:</label></td>  
      45.             <td><input type="text" name="address" id="address"></td>  
      46.         </tr>  
      47.     </table>  
      48. </body>  
      49. </html>  
  • 相关阅读:
    (十一)Updating Documents
    (十)Modifying Your Data
    (九)Delete an Index
    (八)Index and Query a Document
    (七)Create an Index
    (六)List All Indices
    (五)Cluster Health
    (四)Exploring Your Cluster
    (三)Installation
    (二)Basic Concepts 基本概念
  • 原文地址:https://www.cnblogs.com/hechunhua/p/3625307.html
Copyright © 2020-2023  润新知