label是行内元素，text-align对其无效；需作用于父容器或设display:block/inline-block+margin:0 auto；表单中应整体居中label+input容器，用flex布局更可靠。
label 标签本身是行内元素，没有宽度概念，直接加 text-align: center 无效——你得把它作用在 label 的父容器上。
为什么直接给 label 加 text-align: center 没反应
因为 text-align 只对块级容器生效，用来控制其内部的行内内容（比如文字、img）的水平位置。而 label 默认是行内元素，它自己不是“容器”，加了也白加。
- 错误写法：
label { text-align: center; }→ 不起作用 - 正确方向：把
label包进一个div或p，然后给这个父元素设text-align: center - 如果父容器用了
display: flex，text-align会被justify-content覆盖，此时再设也没用
label 单独水平居中（不依赖父容器）的可行方案
想让 label 自身在页面中居中（比如作为标题式标注），必须先让它脱离行内流态：
- 加
display: block或display: inline-block，再配width和margin: 0 auto - 或者用
display: flex+justify-content: center包一层，更稳妥 - 避免用旧式
align="center"属性，和 CSS 冲突时行为不可预测
表单里 label 和 input 一起居中，别只盯 label
实际项目中，你大概率不是只想居中文字，而是让整组 label+input 在表单区域视觉居中。这时候单独处理 label 是治标不治本：
立即学习“前端免费学习笔记（深入）”；
- 结构必须是每组
label和input共同包裹在独立容器中（如div.form-row） - 给该容器设
display: flex; justify-content: center; align-items: center; - 别给
input设vertical-align或margin-top—— flex 容器里这些属性要么无效，要么引发错位 - 所有表单控件（
input、select、button）需统一box-sizing: border-box和vertical-align: middle，否则跨浏览器对齐会翻车
最容易被忽略的一点：居中效果是否生效，往往取决于你操作的是「内容对齐」还是「元素定位」——前者靠 text-align，后者靠布局（flex、margin、position）。混淆这两层，90% 的调试时间都花在冤枉路上。
