這節課，我們學習表單的分組控件。

　　來看"疫情流調信息表"案例，我們清楚的看到，信息表中有兩組邊框，把用戶需要填寫的內容劃分成了兩個區域：一個基本信息區域，一個保密信息區域。那這樣帶有邊框和標題的表單控件是如何實現的呢?

　　分組控件最外層使用 fieldset 標簽，語法為: 尖角號 fieldset，尖角號/fieldset。fieldset是字段集的意思，引申為表單控件分組。

　　里面包裹 legend 標簽，語法為: 尖角號 legend，尖角號/ legend。legend是說明的意思，它給 fieldset 元素定義了一個標題。

　　打開編輯器，新建一個 fieldset_legend.html 頁面，編寫完成基礎代碼，在 body 里面添加一個 fieldset 標簽。

　　在瀏覽器中打開頁面，這時頁面出現了一個閉合的邊框，邊框的作用就是為了將相關字段進行視覺上的區塊劃分。

　　返回編輯其中，在 fieldset 標簽里添加 legend 標簽，在legend 標簽里添加"基礎信息"作為分組標題。保存。

　　回到瀏覽器，刷新。分組的標題也定義好了。

　　也許你會問，其他的表單控件寫在哪里呢?在分組標簽中添加其他控件，需要放置到legend 標簽的后邊。

　　回到編輯器，在legend 標簽結束的位置，回車換行。

　　輸入 "用戶名 : " ，編寫一個輸入框，br 換行。輸入"密碼: " ，再編寫一個密碼框。保存。

　　回到瀏覽器，刷新。一個基礎信息的表單分組就做好了。

　　表單分組就講到這里，留個作業：自己動手完成一個保密信息的分組。加油!

上一篇

如何做用戶分層?

下一篇

表單綜合案例（上）