legend 不能直接用 position: absolute 脱离文档流，因其被浏览器强制绑定在 fieldset 边框左上角；需通过 fieldset 设置 position: relative 后，用绝对定位子元素或 ::before 伪元素模拟悬浮标题。
legend 标签默认是块级元素，但它的定位行为很特殊：它**不能直接用 position: absolute 或 fixed 脱离文档流**，强行设置会失效或导致布局错乱。想让 legend “悬浮”在 fieldset 边框上（比如右上角、左下角），得绕开它本身的定位限制，用包裹容器或伪元素间接实现。
为什么直接对 legend 设置 position: absolute 没反应？
浏览器对 legend 有隐式渲染逻辑——它被强制绑定在 fieldset 的边框起始位置（通常是左上角），且不响应大多数脱离文档流的定位方式。即使你写了：
legend { position: absolute; top: 0; right: 0; }多数浏览器（Chrome、Firefox、Safari）仍会忽略 top/right，坚持把它“钉”在边框左上角。这不是 bug，而是规范允许的渲染自由度。
用 fieldset + relative 包裹，再用 absolute 子元素模拟悬浮标题
真正可控的做法：放弃直接操作 legend，把它设为普通文本（或留空），然后在 fieldset 内部加一个 div 或 span 元素，用 CSS 定位“冒充”标题。
立即学习“前端免费学习笔记（深入）”；
-
fieldset必须显式设为position: relative，否则子元素的absolute会往上找祖先，可能跑到整个页面去 - 模拟标题的元素要设
position: absolute，并用top/right精确控制位置（比如top: -12px; right: 10px;） - 记得给该元素加
background-color和padding，否则文字会和边框重叠或透出 - 如果需要边框“断开”以显示悬浮感，可对
fieldset使用border-top: none或border-bottom: none配合padding调整
用 ::before 伪元素覆盖原 legend 实现轻量悬浮
如果你不想改 HTML 结构，可以用伪元素盖住默认 legend，再定位新标题：
fieldset {
position: relative;
}
fieldset legend {
position: static; /* 确保不干扰 */
width: 0; height: 0; overflow: hidden; /* 隐藏原 legend */
}
fieldset::before {
content: "个人信息";
position: absolute;
top: -14px;
left: 12px;
background: #fff;
padding: 0 8px;
font-size: 14px;
color: #333;
}这个方法不增加 DOM 节点，但要注意：::before 默认是行内元素，需配合 position: absolute 才能自由定位；若 fieldset 有圆角或阴影，::before 的背景色必须和父容器背景一致，否则边缘会露白。
最易被忽略的一点：所有“悬浮”方案都依赖 fieldset 的 position: relative 作为包含块——漏掉这句，absolute 子元素或伪元素就会相对于 body 定位，整个效果就偏了。
