label文字水平居中用text-align:center；整体居中需display:block+margin:0 auto；与input垂直对齐推荐flex+align-items:center；双向居中应分层处理，避免规则冲突。
label 文字水平居中用 text-align: center
label 默认是行内元素，但浏览器会把它当作块级语义容器来渲染（尤其配合 for 属性时）。想让 label 里的文字水平居中，直接给它加 text-align: center 就行——这不是“把 label 框摆中间”，而是让它内部的文本在框里居中。
常见错误：text-align: center 写在父 div 或 form 上，结果没生效。它只对 label 自身起作用，且只影响其**行内内容**（文字、span、img 等）。
- 适用场景：单个 label 独立显示，比如表单顶部说明、独立操作按钮旁的标签
- 不适用场景：label 和 input 并排时单独设这个，会导致文字居中但整体宽度失控，反而破坏对齐
- 注意：如果 label 里嵌了
input或其他块级元素，text-align不会穿透进去，得单独处理子元素
label 整体在页面中水平居中用 margin: 0 auto + display: block
想让整个 label 元素（包括它的边框、padding）在父容器里左右居中，必须让它成为“可被 margin 控制的块级盒子”。默认 label 是 inline，margin: 0 auto 对它无效。
实操写法：label { display: block; width: fit-content; margin: 0 auto; }。其中 width: fit-content 比硬写 width: 200px 更安全，避免文字撑破或留白过大。
立即学习“前端免费学习笔记（深入）”；
- 别漏
display: block—— 这是margin: 0 auto起效的前提 - 如果父容器是 flex 或 grid，
margin: 0 auto会被忽略，此时得改用父容器的justify-content: center - 用
max-width: 100%配合width: fit-content，防止超宽文字溢出
label 和 input 垂直居中对齐必须用 align-items: center 或 vertical-align: middle
label 和 input 天然按 baseline 对齐，不是视觉上的“中间”——label 文字底边和 input 框体中下部对齐，看着就偏高。靠 padding 或 margin 硬推只是掩耳盗铃。
最稳解法：把每组 label+input 包进一个容器，设 display: flex; align-items: center;。这一句直接覆盖 baseline 计算逻辑，无视字体、行高、默认 margin 干扰。
- 若必须用 inline 布局（如旧系统），则 label 和 input 都要显式设
display: inline-block+vertical-align: middle，缺一不可 - 单独给 label 加
vertical-align: middle没用，input 也得同步，否则错位更严重 - iOS Safari 对 label 点击热区有偏差，建议额外加
cursor: pointer和min-height: 1.2em
双向居中（水平+垂直）优先用 Flex 容器包裹
所谓“双向居中”，其实是两个独立需求叠加：label 文字水平居中（text-align），label 整体在父容器中水平居中（margin: 0 auto），再加垂直方向对齐（align-items）。强行在一个 label 上堆砌所有规则，极易冲突。
正确做法：用一层容器控制布局，label 只负责语义和内容。例如：
div.form-row {
display: flex;
align-items: center;
justify-content: center; /* 水平居中整组 */
}
label {
text-align: center; /* 文字居中 */
width: 120px;
margin-right: 8px;
}
input {
flex: 1;
}- justify-content: center 会让整组（label+input）在父容器中水平居中；如果只要 label 自身居中，就别加这句，改用
margin: 0 auto在 label 上 - flex 容器里，
margin: auto在子元素上会失效，别混用 - 真正容易被忽略的是：label 的
for属性和 input 的id必须匹配，否则键盘用户无法用 Tab 键聚焦——对齐再漂亮，无障碍也白搭
