表格布局问卷时，应每组单选/复选用独立tr包裹，td内仅放label+input，统一name确保单选逻辑正确，label显式for关联id，并通过padding扩大点击区域。
表格布局问卷时，tr 和 td 怎么安排才不乱？
直接用 table 套问卷，最容易出现错行、对不齐、点击区域小的问题。关键不是“能不能用”，而是“怎么用才不反人类”。
单选/复选这类控件本身没有块级结构，硬塞进 td 里容易被默认 padding 挤歪，尤其在移动端。
- 每组单选/复选单独占一行：
tr包裹整组，td内只放 label + input，不要把多个input塞进同一个td - 避免嵌套表格：比如在
td里再套一层table对齐选项——这会让语义混乱，JS 获取值也容易出错 - label 必须显式关联：用
for指向id，而不是靠包裹写法；否则点击文字不触发，用户得精准点框 - 留白比对齐更重要：给
td加padding: 8px 12px，比死磕像素对齐更可靠
name 属性写错，会导致单选框变成“可多选”
这是线上问卷最常被忽略的 bug：页面看着是单选，提交后却收到多个值，或者根本没传值。
根源在于 name 不统一或缺失——浏览器根本不认它是“一组”。
立即学习“前端免费学习笔记（深入）”；
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 同一组单选必须共用完全相同的
name，比如性别用name="gender"，婚姻状况用name="marital_status"，不能混用 - 复选框可以共用
name（如name="hobby"），但提交后后端会收到数组，不是单个字符串 - 如果某组只有一项单选，也得加
name，否则它无法参与表单序列化 - 别用中文或空格作
name值，如name="兴趣爱好"—— 后端解析可能失败
checked 默认选中，为什么有时不生效？
写了 checked 却没默认勾上，通常不是语法错，而是被其他逻辑覆盖了。
常见干扰源：JavaScript 初始化、CSS 隐藏了原生控件、或同名 input 被重复渲染。
-
checked是布尔属性，写成checked="checked"或简写checked效果一样，但不能写checked="false" - 如果用 JS 动态生成表单，确保 DOM 插入完成后再设
checked，否则节点还没挂载 - 某些 CSS 重置库（如 normalize.css）会清掉
input[type=radio]的默认样式，导致视觉上“看不出已选”，实际值仍正确 - 服务端渲染时，若模板引擎把
checked渲染成字符串（如checked="{{bool}}"），当 bool 为 false 时可能残留空属性，浏览器误判为 true
移动端点击区域太小，label 怎么扩宽才合理？
手指点不准，本质是原生 input 的点击热区只有 12×12px 左右，远低于 WCAG 推荐的 44×44px 最小触控尺寸。
靠放大 input 自身会破坏布局，真正有效的是控制 label 行为。
- 给
label加display: block或inline-block，再设padding，热区就跟着扩大 - 避免用
label包裹整个tr或table—— 会导致整行可点，误操作率飙升 - 如果用图标替代原生控件（如自定义 radio 圆圈），必须用
aria-checked和role="radio"同步状态，否则读屏器无法识别 - 测试时真机点一点：别只看桌面 Chrome DevTools 的模拟触摸，iOS Safari 和 Android Chrome 对
label绑定的容错性不同
input 在各种设备上都“可发现、可点击、可提交”。很多问题不是 HTML 写错了，而是没意识到浏览器对 name、label、checked 的实际解析规则比文档写的更严格。 
