早在 IE6 时代，我曾经通过创建一个 HTML 来模拟 Windows 风格的分组框（参见示例）div有边框，并定位span将文本放在边框上并使用纯色背景来“擦除”框边框。将组文本放置在框的顶部或底部很简单。
这种技术效果很好，除非背景不是纯色的。我意识到<fieldset> and <legend>标签提供与我描述的完全相同的行为，除了非纯色背景are支持的but文本只能位于字段集上方。
The fieldset and legend组合似乎神奇地工作，无论legend触摸将从中删除fieldset边框（实际上从未绘制过）。为什么要这样做？我已经发现W3 的示例 https://www.w3.org/wiki/HTML/Elements/fieldset说明了行为，但我在 HTML4/5 规范中找不到任何指示 UA“计算图例的宽度并且不在那里绘制边框”的内容。这种行为是否在任何地方定义，或者浏览器供应商一致决定它应该以这种方式绘制？
如果行为未定义...我想用现代的代码替换旧的 IE6 代码，但我不确定是否应该使用fieldset（甚至除了表单）或一些我不知道的CSS功能来擦除边框，就像fieldset实施已经做到了。标准提供的内容取决于什么fieldset或者可靠地模仿它？
图例的位置是标准的。HTML5渲染 https://www.w3.org/TR/html5/rendering.html#the-fieldset-and-legend-elements says
A fieldset https://www.w3.org/TR/html5/forms.html#the-fieldset-element元素的渲染图例 https://www.w3.org/TR/html5/rendering.html#rendered-legend，如果有的话，预计
渲染到顶部边框边缘fieldset https://www.w3.org/TR/html5/forms.html#the-fieldset-element元素
作为“块”框（覆盖任何显式“显示”值）。
它没有明确表示图例后面的边框已被删除，但否则图例将显示为具有穿线装饰。所以浏览器会删除边框。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
