Jacklovely

导航

 

checkbox复选,radio单选

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     <!-- 复选框跟文字联动,需要label标签包裹,并且label里的for是input的id -->
 9     <label for="apple"><input type="checkbox" id="apple">苹果</label>
10     <label for="banana"><input type="checkbox" id="banana">香蕉</label>
11     <label for="peach"><input type="checkbox" id="peach">桃子</label>
12     <br><br>
13     <!-- 单选框只让选一个,name里面用同一个名字就可以 -->
14     <label for="watermelon"><input type="radio" name="fruit" id="watermelon">西瓜</label>
15     <label for="pear"><input type="radio" name="fruit" id="pear">梨子</label>
16     <label for="orange"><input type="radio" name="fruit" id="orange">桔子</label>
17 </body>
18 </html>

 

posted on 2016-12-30 16:24  Jacklovely  阅读(278)  评论(0编辑  收藏  举报