<section class="fieldset">
<h1>This is not a fieldset</h1>
<p>Booyah!</p>
</section>
.fieldset {
position: relative;
border: 1px solid #ddd;
padding: 10px;
}
.fieldset h1 {
position: absolute;
top: 0;
font-size: 18px;
line-height: 1;
margin: -9px 0 0; /* half of font-size */
background: #fff;
padding: 0 3px;
}
不错 :)
这种方法的一个问题当然是边框会隐藏在“图例”的特定颜色(此处为白色)背景后面。
在真正的 fieldset 中,边框在图例处有一个真正的断裂,让任何父元素的原始背景透出来。