fieldset { border: none; } 可一键清边框，但必须同步设 legend { display: block; margin: 0.5em auto 0.75em; }，否则 legend 失去锚点会贴顶、裁切或错位；text-align 无效，需用 margin 控制对齐，禁用 position: absolute 和 flex/grid 直接作用于 fieldset。
fieldset 默认边框怎么一键清掉
直接写 fieldset { border: none; } 就能去掉所有浏览器的默认边框，但别只写这一句——legend 会立刻“飘”上去贴着内容顶部，甚至被裁掉。必须同步处理 legend 的定位和间距。
legend 为什么清完边框就看不见或压住输入框
因为浏览器把 legend 当作“嵌入上边框”的特殊元素，不是普通子节点。一旦 fieldset 的 border 被设为 none，legend 就失去锚点，退化成 inline 元素，默认挤在左上角、无垂直间隔。
-
legend必须显式设为display: block或display: inline-flex - 加最小安全间距：
legend { margin: 0.5em auto 0.75em; }（Firefox 和 Chrome 都认） - 别设
width或max-width，Firefox 下容易换行错位 - 绝对不要用
position: absolute，它会断开语义关联，屏幕阅读器读不到
想让 legend 左对齐/右对齐/居中，该怎么写
text-align 对 legend 没用——它只影响内部文字，不移动整个元素位置。真正生效的是盒模型控制：
- 居中：
legend { display: block; margin: 0 auto; } - 右对齐：
legend { display: block; margin-left: auto; } - 左对齐（默认但需显式加固）：
legend { display: block; margin-left: 0; } - 如果
fieldset已设display: flex，legend 会退化成普通子项，建议包一层<div>再控制对齐
给 fieldset 加了 flex/grid 后 legend 错位或消失
这是最常踩的坑：一旦 fieldset 设了 display: flex 或 display: grid，原生的“legend 嵌入上边框”机制彻底失效。它不再有特殊定位逻辑，变成一个普通 flex item，可能卡左上角、被边框盖住，甚至被 overflow: hidden 裁掉。
立即学习“前端免费学习笔记（深入）”；
- 安全解法：把
legend包进<div class="legend-wrapper">，再对 wrapper 设align-self: flex-start - 轻量解法：用
legend { display: inline-flex; align-items: center; }，比block更稳，兼容性也更好 - 千万别指望
legend在 flex 容器里还能自动“浮”到顶部——它不会
