HTML-fieldset与legend的使用

fieldset 可以对表单组件进行分组
legend 可以对分组进行命名

效果：

源码：

 <form action="">
       <fieldset>
        <legend>主要信息legend>
         
         <label for="zhanghu">账户label>
         <input "text" id="zhanghu" name="account" value="张三" maxlength="10" ><br>
         
         <label >  
             密码：
             <input type="password" name="pwd" value="123" maxlength="6" ><br>
         label>
       fieldset>

        <fieldset>
            <legend>附加信息legend>
            
        性别：
        <input type="radio"  id ="nan"name="gender" value="male" >
        <label for="nan">男label>
        <input type="radio" id="nv" name="gender" value="female" checked>
        <label for="nv">女label>
        <br>

        爱好：
        <input type="checkbox" name="hobby" value="smoke" id="smoke">
        <label for="smoke">抽烟label>
        <input type="checkbox" name="hobby" value="drink" id="drink">
        <label for="drink">喝酒label>
        <input type="checkbox" name="hobby" value="perm" id="perm">
        <label for="perm">烫头label>
        <br>
  
        <label for="qita"> 其他:label>
        <textarea name="other" cols="30" rows="10" id="qita">textarea>
        <br>
       
        <label for="jiguan">籍贯:label>
        <select name="place" id="jiguan">
            <option value="冀">河北option>
            <option value="鲁">山东option>
            <option value="晋" selected>山西option>
        select>
        fieldset>
      
        <input type="hidden" name="tag" value="123">
        
        <br>
        <button>确认button>
        
        <button type="reset">重置button>
     
        <button type="button">检测账户是否注册button>
    form>