HTML實戰：個人資訊登記表
阿新 • • 發佈：2022-04-22
效果展示：
程式碼示例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h3>個人資訊登記表</h3> <!-- 表格標籤--> <table> <!-- 定義第一行--> <tr> <td>性別:</td> <td> <!--單選項--> <label for="nan">男</label><input type="radio" name="sex" id="nan"> <label for="nv">女</label><input type="radio" name="sex" id="nv"> </td> </tr> <!-- 第二行--> <tr> <td>出生日期:</td> <td> <!--多選框--> <select name="" id=""> <option value="">--請選擇年份--</option> <option value="">2022</option> <option value="">2021</option> <option value="">2020</option> </select> <select name="" id=""> <option value="">--請選擇月份--</option> <option value="">12月</option> <option value="">11月</option> <option value="">10月</option> <option value="">9月</option> <option value="">8月</option> <option value="">7月</option> <option value="">6月</option> <option value="">5月</option> <option value="">4月</option> <option value="">3月</option> <option value="">2月</option> <option value="">1月</option> </select> <select name="" id=""> <option value="">--請選擇天數--</option> <option value="">31日</option> <option value="">30日</option> <option value="">29日</option> <option value="">28日</option> <option value="">27日</option> <option value="">26日</option> <option value="">25日</option> <option value="">24日</option> <option value="">23日</option> <option value="">22日</option> <option value="">21日</option> <option value="">20日</option> <option value="">19日</option> <option value="">18日</option> <option value="">17日</option> <option value="">16日</option> <option value="">15日</option> <option value="">14日</option> <option value="">13日</option> <option value="">12日</option> <option value="">11日</option> <option value="">10日</option> <option value="">9日</option> <option value="">8日</option> <option value="">7日</option> <option value="">6日</option> <option value="">5日</option> <option value="">4日</option> <option value="">3日</option> <option value="">2日</option> <option value="">1日</option> </select> </td> </tr> <!-- 第三行--> <tr> <td>所在地區：</td> <td> <!--文字框--> <input type="text" value="長沙"> </td> </tr> <!-- 第四行--> <tr> <td>婚姻情況：</td> <td> <!--單選框--> <input type="radio" name="marry" id="yihun"> <label for="yihun">已婚</label> <input type="radio" name="marry" id="weihun"> <label for="weihun">未婚</label> <input type="radio" name="marry" id="lihun"> <label for="lihun">離婚</label> </td> </tr> <!-- 第五行--> <tr> <!--多選框--> <td>愛好：</td> <td> <input type="checkbox" name="hobby" id="sing"><label for="sing">唱歌</label> <input type="checkbox" name="hobby" id="dance"><label for="dance">跳舞</label> <input type="checkbox" name="hobby" id="swim"><label for="swim">游泳</label> <input type="checkbox" name="hobby" id="run"><label for="run">跑步</label> </td> </tr> <!-- 第六行--> <tr> <td></td> <td> <!--提交按鈕--> <input type="submit" value="免費註冊"> </td> </tr> <!-- 第七行--> <tr> <!--複選框--> <td></td> <td> <input type="checkbox" id="xieyi"><label for="xieyi">我同意條款並願意加入</label> </td> </tr> <!-- 第八行--> <tr> <!--無序列表--> <td></td> <td> <ul> <li>我承諾</li> <li>年滿十八歲</li> <li>自願加入</li> </ul> </td> </tr> </table> </body> </html>