单选与多选与label

标签：check   idt   输入框   width   关系   定义   单元   表单元素   css   

单选radio和多选checkbox是用name属性关联的

相同的name就相当于同一道题

<input type="radio" name="radio">
<input type="radio" name="radio">
<hr>
<input type="checkbox" name="checkbox">
<input type="checkbox" name="checkbox">

独立的单选多选只有点击页面上的那个点才能选中
想要实现点击这个选项对应的文字也能选中需要用到<label>标签

label标签有两种写法
一种是无需父子关系的id与for绑定

<input type="checkbox" id="aa" name="xx"/>      
<lable for="aa">点我也能选中</lable>

一种是父子关系无需id和for

<lable>
<input type="checkbox" name="xx"/>点我也能选中
</lable>

要注意的是label里只能出现一个input表单元素，输入框也一样，如果有两个，会点不到

还有就是单选和多选的大小调整需要同时修改宽width和高height，只改一个是没作用的，但是改大小的样式依旧很丑，建议自定义单选多选样式，如何自定义，查看css笔记的css常用代码

单选与多选与label

标签：check   idt   输入框   width   关系   定义   单元   表单元素   css   

原文地址：https://www.cnblogs.com/pengdt/p/12037535.html