将图例移动到表单中较低的字段集中

Question

在经典形式中，我们在顶部边框的同一行上有图例标记，如下所示。

代码是：

...
<fieldset>
    <legend>Connexion</legend>
    ...
</fieldset>

是否可以将此图例移动到公式中，如下所示？

知道什么是CSS吗？

感谢。

---

更新

以下是应用以下CSS后的结果：

fieldset { 
    position:relative;   
}    

legend { 
    top:20px; 
    position:absolute; 
    font-size:20px; 
    font-weight:bold    
} 

如何在图例'Connexion'之后添加更多空间？

Answer 1

你确定可以用CSS做到这一点。如果不使用绝对定位，最终会在fieldset边界中留下很大的差距。

fieldset {
    position:relative;  
}   

legend {
    top:50px;
    position:absolute;
    font-size:20px;
    font-weight:bold   
}