HTML <fieldset>標(biāo)記位于 <form>標(biāo)記內(nèi),用于對(duì)HTML表單中的相關(guān)元素進(jìn)行分組。使用 <legend>標(biāo)記為 <fieldset>創(chuàng)建標(biāo)題。該標(biāo)記通常也稱為 <fieldset>元素。
對(duì)表單中的相關(guān)元素進(jìn)行分組:
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>HTML5 fieldset標(biāo)簽的使用(菜鳥教程 cainiaoplus.com)</title> </head> <body> <form> <fieldset> <legend>客戶資料(cainiaoplus.com)</legend> 名稱: <input type="text"><br> 地址: <input type="text"><br> 電話號(hào)碼: <input type="text"> </fieldset> </form> </body> </html>測(cè)試看看 ?/?
運(yùn)行后效果如下:
IEFirefoxOperaChromeSafari
所有主流瀏覽器都支持 <fieldset> 標(biāo)簽。
<fieldset> 標(biāo)簽可以將表單內(nèi)的相關(guān)元素分組。
<fieldset> 標(biāo)簽會(huì)在相關(guān)表單元素周圍繪制邊框。
大多數(shù)瀏覽器會(huì)在<fieldset>標(biāo)記周圍呈現(xiàn)黑色邊框,但是您可以使用CSS更改此行為。
您可以使用<legend>標(biāo)記顯示<fieldset>的標(biāo)題。該標(biāo)題將在<fieldset>中的相關(guān)表單控件之前呈現(xiàn),并看起來(lái)漂浮在<fieldset>頂部邊框的上方。
提示:<legend> 標(biāo)簽為 <fieldset> 元素定義標(biāo)題。
HTML5 中新增了一些 <fieldset> 的新屬性:disabled、form、name,HTML 4.01 中不支持這些屬性。
屬性 | 值 | 描述 |
---|---|---|
disabledHTML5 | disabled | 規(guī)定該組中的相關(guān)表單元素應(yīng)該被禁用。 |
formHTML5 | form_id | 規(guī)定 fieldset 所屬的一個(gè)或多個(gè)表單。 |
nameHTML5 | text | 規(guī)定 fieldset 的名稱。 |
<fieldset> 標(biāo)簽支持 HTML 的全局屬性。
<fieldset> 標(biāo)簽支持 HTML 的事件屬性。