如何在邊界中間顯示html圖例標記？

我很好奇網頁瀏覽器如何通過在邊框之間插入內容來顯示legend標籤內容。如果我想自己重新創建，我想我會陷入絕對/相對定位，但我認爲/希望有一個更清潔的方式..：P如何在邊界中間顯示html圖例標記？

我檢查了源代碼，但很快放棄：P

下面是一些示例代碼：

<fieldset> 
 
    <legend>How did i get here?</legend> 
 
    Name: <input type="text"><br> 
 
    Email: <input type="email"> 
 
</fieldset>

2016-10-03 Govind Rai

這個以前的答案有幫助嗎？ http://stackoverflow.com/questions/7731310/text-in-border-css-html – SomeGuy

這絕對是一個有見地的答案，但它不提供我正在尋找的答案。例如，無論你增加'legend'標籤的'font-size'多少，它都會顯得很乾淨和集中。然而，在上述答案中，用戶正在對邊距和填充進行猜測工作，以查看定位是否準確呈現。 –

所以我做了this JSFiddle

我希望這回答了你的問題。

2018-02-02 22:04:18 Garric15

回答