模塊八 DreamweaverCS中使用表單

本模塊導(dǎo)讀表單是網(wǎng)頁中能夠讓瀏覽者與網(wǎng)頁制作者進(jìn)行交流的元素。在各種網(wǎng)站中，表單扮演著相當(dāng)重要的角色，由這些表單配合相關(guān)程序，使得網(wǎng)頁可以收集、分析用戶的反饋意見，作出科學(xué)、合理的決策，是一個(gè)網(wǎng)站成功的重要因素。本模塊主要講解表單及表單對(duì)象在網(wǎng)頁中的應(yīng)用及其屬性設(shè)置，從而能創(chuàng)作出帶表單的靜態(tài)網(wǎng)頁。并且詳細(xì)介紹了“文本域和隱藏域”、“復(fù)選框和單選按鈕”、“列表和菜單”、“表單按鈕”等幾項(xiàng)常用表單對(duì)象的設(shè)置與使用。最通過實(shí)例來講解表單對(duì)象的綜合運(yùn)用，加深讀者對(duì)表單功能的理解。本模塊要點(diǎn)→網(wǎng)頁中表單的概念→在網(wǎng)頁中插入表單并設(shè)置其屬性→各表單對(duì)象的使用→表單對(duì)象的屬性設(shè)置→用表單制作留言板網(wǎng)頁模塊八

使用表單模塊八

使用表單任務(wù)一創(chuàng)建表單任務(wù)二插入表單對(duì)象學(xué)材小結(jié)任務(wù)一創(chuàng)建表單目前很多網(wǎng)站都要求訪問者填寫各種表單進(jìn)行注冊(cè)、收集用戶資料、獲取用戶訂單，表單已成為網(wǎng)站實(shí)現(xiàn)互動(dòng)功能的重要組成部分。表單是網(wǎng)頁管理者與訪問者之間進(jìn)行動(dòng)態(tài)數(shù)據(jù)交換的一種交互方式。從表單的工作流程來看，表單的開發(fā)分為兩部分，一是在網(wǎng)頁上制作具體的表單項(xiàng)目，這一部分稱為前端，主要在Dreamweaver中制作；另一部分是編寫處理表單信息的應(yīng)用程序，這一部分稱為后端，如：ASP、CGI、PHP、JSP等。本模塊內(nèi)容主要講解的是前端的設(shè)計(jì)，后臺(tái)的開發(fā)將在以后介紹。知識(shí)導(dǎo)讀任務(wù)一創(chuàng)建表單表單是實(shí)現(xiàn)動(dòng)態(tài)網(wǎng)頁的一種主要的外在形式，可以使網(wǎng)站的訪問者與網(wǎng)站之間輕松的進(jìn)行交互。使用表單，可以幫助Internet服務(wù)器從用戶那里收集信息，實(shí)現(xiàn)用戶與網(wǎng)頁上的功能互動(dòng)。通過表單可以收集站點(diǎn)訪問者的信息，可以用做調(diào)查工具或收集客戶登錄信息，也可用于制作復(fù)雜的電子商務(wù)系統(tǒng)。子任務(wù)1了解表單的概念表單相當(dāng)于一個(gè)容器，它容納的是承載數(shù)據(jù)的表單對(duì)象，例如：文本框、復(fù)選框等。因此一個(gè)完整的表單包括二部分：表單及表單對(duì)象，二者缺一不可。用戶可以通過單擊【插入記錄】→【表單】來插入表單對(duì)象，或者通過“插入”欄的“表單”面板來插入表單對(duì)象，如圖8-1所示。任務(wù)一創(chuàng)建表單子任務(wù)2認(rèn)識(shí)表單對(duì)象圖8-1“插入”欄“表單”面板任務(wù)一創(chuàng)建表單1、表單：在文檔中插入表單。任何其他表單對(duì)象，如文本域、按鈕等，都必須插入表單之中，這樣所有瀏覽器才能正確處理這些數(shù)據(jù)。2、文本字段：文本字段可接受任何類型的字母或數(shù)字項(xiàng)。輸入的文本可以顯示為單行、多行或者顯示為項(xiàng)目符號(hào)或星號(hào)（用于保護(hù)密碼）。文本框用來輸入比較簡(jiǎn)單的信息。3、文本區(qū)域：如果需要輸入建議、需求等大段文字，這時(shí)通常使用帶有滾動(dòng)條的文本區(qū)域。4、隱藏域：可以在表單中插入一個(gè)可以存儲(chǔ)用戶數(shù)據(jù)的域。使用隱藏域可以存儲(chǔ)用戶輸入的信息，如姓名、電子郵件地址或愛好的查看方式等，以便該用戶下次訪問站點(diǎn)時(shí)可以再次使用這些數(shù)據(jù)。子任務(wù)2認(rèn)識(shí)表單對(duì)象5、復(fù)選框：在表單中插入復(fù)選框。復(fù)選框允許在一組選項(xiàng)中選擇多項(xiàng)，用戶可以選擇任意多個(gè)適用的選項(xiàng)。6、單選按鈕：在表單中插入單選按鈕。單選按鈕代表互相排斥的選擇。選擇一組中的某個(gè)按鈕，就會(huì)取消選擇該組中的所有其他按鈕。例如，用戶可以選擇“是”或“否”。7、單選按鈕組：插入共享同一名稱的單選按鈕的集合。8、列表/菜單：可以在列表中創(chuàng)建用戶選項(xiàng)?！傲斜怼边x項(xiàng)在滾動(dòng)列表中顯示選項(xiàng)值，并允許用戶在列表中選擇多個(gè)選項(xiàng)?！安藛巍边x項(xiàng)在彈出式菜單中顯示選項(xiàng)值，而且只允許用戶選擇一個(gè)選項(xiàng)。9、跳轉(zhuǎn)菜單：插入可導(dǎo)航的列表或彈出式菜單。跳轉(zhuǎn)菜單允許插入一種菜單，在這種菜單中的每個(gè)選項(xiàng)都鏈接到文檔或文件。任務(wù)一創(chuàng)建表單子任務(wù)2認(rèn)識(shí)表單對(duì)象10、圖像域：可以在表單中插入圖像?？梢允褂脠D像域替換“提交”按鈕，以生成圖形化按鈕。11、文件域：可在文檔中插入空白文本域和“瀏覽”按鈕。文件域使用戶可以瀏覽到其硬盤上的文件，并將這些文件作為表單數(shù)據(jù)上傳。12、按鈕：在表單中插入文本按鈕。按鈕在單擊時(shí)執(zhí)行任務(wù)，如提交或重置表單?？梢詾榘粹o添加自定義名稱或標(biāo)簽，或者使用預(yù)定義的“提交”或“重置”標(biāo)簽之一。13、標(biāo)簽：可在文檔中給表單加上標(biāo)簽，以<label></label>形式開頭和結(jié)尾。14、字段集：可在文本中設(shè)置文本標(biāo)簽。任務(wù)一創(chuàng)建表單子任務(wù)2認(rèn)識(shí)表單對(duì)象在網(wǎng)頁中插入表單的操作步驟如下：步驟１執(zhí)行【文件】→【新建】命令，新建網(wǎng)頁文件。步驟２將光標(biāo)放在希望表單出現(xiàn)的位置，選擇菜單欄【插入記錄】→【表單】→【表單】命令，如圖8-2所示?；蜻x擇“插入”欄上的“表單”類別，然后單擊“表單”圖標(biāo)，如圖8-1所示。任務(wù)一創(chuàng)建表單圖8-2插入表單的菜單命令圖8-3插入表單的網(wǎng)頁文檔子任務(wù)3插入表單1.插入表單子任務(wù)3插入表單任務(wù)一創(chuàng)建表單步驟3

此時(shí)頁面上出現(xiàn)紅色的虛輪廓線，以此指示表單，如圖8-3所示。步驟4

執(zhí)行【文件】→【保存】命令，保存文件。任務(wù)一創(chuàng)建表單2.設(shè)置表單屬性用鼠標(biāo)選中表單，在屬性面板上可以設(shè)置表單的各項(xiàng)屬性，如圖如圖8-4所示。圖8-4表單屬性面板(1)“表單名稱”：給表單命名，這樣方便用腳本語言對(duì)其進(jìn)行控制。(2)“動(dòng)作”：指定處理表單信息的服務(wù)器端應(yīng)用程序。單擊文件夾目標(biāo)，找到應(yīng)用程序，或直接輸入應(yīng)用程序路徑。(3)“目標(biāo)”：選擇打開返回信息網(wǎng)頁的方式。(4)“方法”：定義處理表單數(shù)據(jù)的方法，具體內(nèi)容如下：“默認(rèn)”：使用瀏覽器默認(rèn)的方法（一般為GET）?！癎ET”：把表單值添加給URL，并向服務(wù)器發(fā)送GET請(qǐng)求。因?yàn)閁RL被限定在8192個(gè)字符之內(nèi)，所以不要對(duì)長(zhǎng)表單使用GET方法?！癙OST”：把表單數(shù)據(jù)嵌入到HTTP請(qǐng)求中發(fā)送。(5)“MIME類型”：用來設(shè)置發(fā)送MIME編碼類型，有兩個(gè)選項(xiàng)?！癮pplication/x-www-form-urlencode”：默認(rèn)的MIME編碼類型，通常與“POST”方法協(xié)同使用?！癿ultipart/form-data”：如果表單包含文件域，應(yīng)該選擇multipart/form-dataMIME類型。任務(wù)一創(chuàng)建表單子任務(wù)1插入文本域和隱藏域1.插入文本域

文本域是表單中非常重要的表單對(duì)象。當(dāng)瀏覽者瀏覽網(wǎng)頁需要輸入文字資料，如姓名、地址、E-mail或稍長(zhǎng)一些的個(gè)人介紹等欄目時(shí)，就可以使用文本域。文本域分單行文本域、多行文本域和密碼域三種類型。具體操作如下：任務(wù)二插入表單對(duì)象步驟１插入文本域之前請(qǐng)確定已經(jīng)先插入了一個(gè)表單域，并且將光標(biāo)放入表單域中。步驟２選擇插入欄的“表單”分類的“文本字段”按鈕，如圖8-1，彈出“圖像標(biāo)簽輔助功能屬性”對(duì)話框，如圖所示任務(wù)二插入表單對(duì)象步驟３可以輸入文本字段的標(biāo)簽文字，然后單擊【確定】按鈕。也可單擊【取消】按鈕，在表單域中自行添加文字作為文本字段的標(biāo)簽文字。步驟４設(shè)置文本字段的屬性。單擊“文本字段”，在其“屬性”面板上進(jìn)行屬性設(shè)置。如圖所示。

可以執(zhí)行【編輯】→【首選參數(shù)】命令，在“首選參數(shù)”的左側(cè)列表中選擇“輔助功能”項(xiàng)，取消“表單對(duì)象”的選中狀態(tài)。這樣以后插入表單對(duì)象時(shí)就不會(huì)顯示如圖8_5所示的對(duì)話框了。信息卡任務(wù)二插入表單對(duì)象“文本字段”對(duì)象具有下列屬性：(1)“文本域”：指定文本域的名稱，通過它可以在腳本中引用該文本域。(2)“字符寬度”：設(shè)置文本域中最多可顯示的字符數(shù)。(3)“最大字符數(shù)”：允許使用者輸入的最大的字符個(gè)數(shù)。(4)“初始值”：表單首次被載入時(shí)顯示在文本字段中的值。(5)“類型”：可以選擇文本域的類型，其中包括“單行”、“多行”和“密碼”?！皢涡小保褐豢娠@示一行文本，是插入文本域時(shí)默認(rèn)的選項(xiàng)?！岸嘈小保嚎梢燥@示多行文本，選擇該項(xiàng)時(shí)屬性面板將產(chǎn)生變化，增加了用于設(shè)置多行文本的選項(xiàng)?！懊艽a”：用于輸入密碼的單行文本域。輸入的內(nèi)容將以符號(hào)顯示，防止被其他人看到，但該數(shù)據(jù)通過后臺(tái)程序發(fā)送到服務(wù)器上時(shí)將仍然顯示為原本的內(nèi)容。(6)“行數(shù)”：當(dāng)類型設(shè)置為“多行”時(shí)，設(shè)置文本域中的行數(shù)。(7)“換行”：當(dāng)類型設(shè)置為“多行”時(shí)，設(shè)置文本域中的換行方式。圖所示的是一個(gè)同時(shí)擁有3種文本域類型的實(shí)例。任務(wù)二插入表單對(duì)象“文本區(qū)域”表單對(duì)象與“文本字段”表單對(duì)象的使用方法相似，請(qǐng)讀者自行設(shè)置。信息卡任務(wù)二插入表單對(duì)象2.插入隱藏域若要在表單結(jié)果中包含不讓站點(diǎn)訪問者看見的信息，可在表單中添加隱藏域。當(dāng)提交表單時(shí)，隱藏域就會(huì)將非瀏覽者輸入的信息發(fā)送到服務(wù)器上，為制作數(shù)據(jù)接口做準(zhǔn)備。步驟：

步驟１將光標(biāo)置于頁面中需要插入隱藏域的位置。步驟２選擇插入欄的“表單”分類的“隱藏域”按鈕，隨后一個(gè)隱藏域的標(biāo)記便插入到了網(wǎng)頁中。步驟３單擊隱藏域的標(biāo)記將其選中，隱藏域的屬性面板出現(xiàn)，如圖8-8所示?！半[藏域”對(duì)象具有下列屬性：(1)“隱藏區(qū)域”：指定隱藏域的名稱，默認(rèn)為hiddenField。(2)“值”：設(shè)置要為隱藏域指定的值，該值將在提交表單時(shí)傳遞給服務(wù)器。任務(wù)二插入表單對(duì)象1.插入單選按鈕如果想讓訪問者從一組選項(xiàng)中選擇其中之一，可以在表單中添加單選按鈕。常見的如性別、學(xué)歷等內(nèi)容都會(huì)使用單選按鈕來進(jìn)行設(shè)置。單選按鈕允許用戶在多個(gè)選項(xiàng)中選擇一個(gè)，不能進(jìn)行多項(xiàng)選擇。插入單選按鈕的具體操作如下：步驟：步驟１將光標(biāo)放入表單域中要插入單選按鈕的位置。步驟２選擇插入欄的“表單”分類的“單選按鈕”按鈕，如圖8-1，彈出“輸入標(biāo)簽輔助功能屬性”對(duì)話框，如圖8-5所示。步驟3

可以輸入單選按鈕的標(biāo)簽文字，并選擇文字在單選按鈕的前面顯示或后面顯示，然后單擊【確定】按鈕。也可單擊【取消】按鈕，在表單域中自行添加文字作為標(biāo)簽文字。如圖所示，在表單中添加單選按鈕。子任務(wù)2插入單選按鈕和復(fù)選框任務(wù)二插入表單對(duì)象步驟4

設(shè)置單選按鈕的屬性。單擊“單選按鈕”對(duì)象，在其“屬性”面板上進(jìn)行屬性設(shè)置。如圖8-10所示?！皢芜x按鈕”對(duì)象具有下列屬性：(1)“單選按鈕”：?jiǎn)芜x按鈕的名稱，在同一組的單選按鈕名稱必須相同。(2)“選定值”：設(shè)置該按鈕被選中時(shí)發(fā)送給服務(wù)器的值。(3)“初始狀態(tài)”有“已勾選(C)”和“未選中(U)”兩種，表示該按鈕是否被選中?！耙压催x(C)”：表示在瀏覽時(shí)單選按鈕顯示為勾選狀態(tài)；“未選中(U)”：表示在瀏覽時(shí)單選按鈕顯示為不勾選的狀態(tài)。在一組單選按鈕中只能設(shè)置一個(gè)單選按鈕為“已勾選”。在一組單選按鈕中只能設(shè)置一個(gè)單選按鈕為“已勾選”。。注意任務(wù)二插入表單對(duì)象子任務(wù)2插入單選按鈕和復(fù)選框2.插入復(fù)選框使用“復(fù)選框”表單對(duì)象可以在網(wǎng)頁中設(shè)置多個(gè)可供瀏覽者進(jìn)行選擇的項(xiàng)目，常用于調(diào)查類欄目中。插入復(fù)選框的具體操作如下：步驟：步驟１將光標(biāo)放入表單域中要插入復(fù)選框的位置。步驟２選擇插入欄的“表單”分類的“復(fù)選框”按鈕，如圖8-1，彈出“輸入標(biāo)簽輔助功能屬性”對(duì)話框，如圖8-5所示。步驟3

標(biāo)簽文字的設(shè)置同“單選按鈕”標(biāo)簽文字的設(shè)置。如圖8-11所示，在表單中添加復(fù)選框。任務(wù)二插入表單對(duì)象子任務(wù)2插入單選按鈕和復(fù)選框?qū)W材小結(jié)步驟4

設(shè)置復(fù)選框的屬性。單擊“復(fù)選框”對(duì)象，在其“屬性”面板上進(jìn)行屬性設(shè)置。如圖8-12所示?！皬?fù)選框”對(duì)象具有下列屬性：(1)“復(fù)選框名稱”：是給復(fù)選框命名，通過該名稱可以在腳本中引用復(fù)選框。(2)“選定值”：設(shè)置復(fù)選框被選擇時(shí)發(fā)送給服務(wù)器的值。(3)“初始狀態(tài)”：為設(shè)置首次載入表單時(shí)復(fù)選框是已選還是未選，具體同“單選按鈕”。子任務(wù)2插入單選按鈕和復(fù)選框子任務(wù)3插入列表和菜單使用“列表/菜單”對(duì)象，可以讓訪問者從“列表/菜單”中選擇選項(xiàng)。在擁有較多選項(xiàng)并且網(wǎng)頁空間比較有限的情況下，“列表/菜單”將會(huì)發(fā)揮出最大的作用。其具體操作步驟如下。步驟：步驟１將光標(biāo)置于頁面中需要插入列表、菜單的位置。步驟２選擇插入欄的“表單”分類，單擊“列表/菜單”按鈕，隨后一個(gè)列表/菜單便插入到了網(wǎng)頁中。步驟3

設(shè)置列表/菜單的屬性。使用鼠標(biāo)單擊“列表/菜單”，此時(shí)顯示“列表/菜單”的屬性面板。如圖8-13所示?！傲斜?菜單”屬性面板中的選項(xiàng)如下：(1)“列表/菜單”:為列表/菜單指定一個(gè)名稱。(2)“類型”：有“菜單”和“列表”兩種可選。(3)“列表值…”:可選的列表的值。(4)“高度”：用來設(shè)置列表菜單中的項(xiàng)目數(shù)。如果實(shí)際的項(xiàng)目數(shù)多于此數(shù)目，那么列表菜單的右側(cè)將使用滾動(dòng)條。(5)“允許多選”：允許瀏覽者從列表菜單中選擇多個(gè)項(xiàng)目。(6)“初始化時(shí)選定”：可以設(shè)置一個(gè)項(xiàng)目作為列表中默認(rèn)選擇的菜單項(xiàng)。步驟4

單擊“屬性面板”中“列表值…”按鈕，出現(xiàn)“列表值”對(duì)話框，單擊“+”按鈕依次添加“項(xiàng)目標(biāo)簽”和“值”，如圖所示8-14所示。單擊確定完成設(shè)置。效果如圖所示8-15所示。子任務(wù)3插入列表和菜單

對(duì)表單而言，按鈕是非常重要的，它能夠控制對(duì)表單內(nèi)容的操作，如【提交】按鈕或【重置】按鈕。要將表單內(nèi)容發(fā)送到遠(yuǎn)端服務(wù)器上，請(qǐng)使用【提交】按鈕；要清除現(xiàn)有的表單內(nèi)容，請(qǐng)使用【重置】按鈕。插入表單按鈕的具體操作步驟如下。步驟：步驟1

將鼠標(biāo)光標(biāo)置于頁面中需要插入按鈕的位置。步驟2

選擇插入欄的“表單”分類，單擊“按鈕”按鈕，隨后一個(gè)按鈕便插入到了網(wǎng)頁中。步驟3

設(shè)置按鈕的屬性。使用鼠標(biāo)單擊“按鈕”，此時(shí)顯示“按鈕”的屬性面板。如圖8-16所示。子任務(wù)4插入表單按鈕“按鈕”屬性面板中的選項(xiàng)如下：(1)“按鈕名稱”：為按鈕設(shè)置一個(gè)名稱。(2)“標(biāo)簽”：設(shè)置顯示在按鈕上的文本。(3)“動(dòng)作”:為確定按鈕被單擊時(shí)發(fā)生的操作，有3種選擇?！疤峤槐韱巍保罕硎締螕舭粹o將提交表單數(shù)據(jù)內(nèi)容至表單域“動(dòng)作”屬性中指定的頁面或腳本?！爸卦O(shè)表單”：表示單擊該按鈕將清除表單中的所有內(nèi)容?！盁o”：表示單擊該按鈕時(shí)不發(fā)生任何動(dòng)作。添加“按鈕”表單對(duì)象的頁面效果如圖8-17所示。表單實(shí)際包含的表單對(duì)象還有很多種，例如“單選按鈕組”、“圖像域”、“文件域”、“跳轉(zhuǎn)菜單”等，其屬性設(shè)置和使用方式與前面詳細(xì)介紹的幾種表單對(duì)象類似，在此請(qǐng)讀者自行學(xué)習(xí)。信息卡子任務(wù)4插入表單按鈕表單是網(wǎng)頁中實(shí)現(xiàn)客戶和網(wǎng)站進(jìn)行交流的最基本的結(jié)構(gòu)。對(duì)于表單來說，涉及的方面很多，特別是在表單同服務(wù)器端聯(lián)系時(shí)。涉及到一些編程語言，另外就是表單本在網(wǎng)頁中的顯示也是很復(fù)雜的問題。本模塊只介紹網(wǎng)頁中表單和表單對(duì)象的基本作用和使用方法，并沒有實(shí)現(xiàn)瀏覽者與服務(wù)器之間的交互作用。關(guān)于表單的交互作用將在以后的模塊中作介紹。子任務(wù)4插入表單按鈕學(xué)材小結(jié)

理論知識(shí)1.判斷題(1)“單行”是插入文本域時(shí)默認(rèn)的選項(xiàng)，只可顯示單行文本。()(2)“多行”表示插入的文本域可以顯示多行文本，但不能顯示單行。()(3)“單選按鈕”文本框?yàn)閱芜x按鈕指定一個(gè)名稱。多個(gè)“單選按鈕”，可以有多個(gè)名稱。()(4)在要求瀏覽者從一組選項(xiàng)中選擇多個(gè)選項(xiàng)時(shí)，可以使用單選按鈕。()(5)要清除現(xiàn)有的表單內(nèi)容，請(qǐng)使用“重置”按鈕。()2.填空題(1)設(shè)置表單的屬性時(shí)，“表單名稱”文本框是

。(2)文本域中“字符寬度”是

而“最多字符數(shù)”是

。(3)每個(gè)表單都是由

組成的，而且所有的

放到表單中才會(huì)有效，因此，制作表單頁面的第一步是創(chuàng)建

。(4)在表單中使用表單對(duì)象時(shí)，要為

指定一個(gè)名稱，這樣由

的名稱和用戶提供的信息(即值)組合成

。(5)如果希望一次選取多個(gè)選項(xiàng)，應(yīng)使用

對(duì)象。(6)在表單中要添加一個(gè)密碼框，應(yīng)使用表單中

對(duì)象。實(shí)訓(xùn)任務(wù)

實(shí)訓(xùn)一利用表單制作留言板【實(shí)訓(xùn)目的】注意表單的設(shè)計(jì)，選擇正確的表單對(duì)象，通過實(shí)例制作，可以掌握表單的創(chuàng)建及設(shè)計(jì)技巧。本例任務(wù)是完成表單的前端界面的制作?！緦?shí)訓(xùn)內(nèi)容】本案例利用表單及表單對(duì)象在網(wǎng)頁中的應(yīng)用，制作“班級(jí)留言板”。最終效果如圖8-18所示。制作步驟如下:(本實(shí)訓(xùn)任務(wù)中所用素材在配套光盤中的“module08\shixun”文件夾中。)圖8-18班級(jí)留言板

步驟：

步驟1

執(zhí)行【文件】→【新建】命令，新建一個(gè)名為“biaodan.htm”網(wǎng)頁文件。點(diǎn)擊“屬性面板”中的

命令設(shè)置頁面背景為“images/bookbg.gif”。步驟2

在頁面中輸入標(biāo)題“班級(jí)留言板”，并對(duì)字體、字號(hào)及樣式作出相應(yīng)設(shè)置。步驟3

單擊

欄

選項(xiàng)

按鈕，插入一個(gè)表單，在“文檔”窗口中出現(xiàn)一個(gè)紅色的虛線框。步驟3

單擊虛線框內(nèi)，插入一個(gè)11行3列的表格，采用表格進(jìn)行排版。選中表格，在

面板中設(shè)置表格寬度為“565”像素，邊框?qū)挾葹椤?”像素，表格背景色為“白色”，表格對(duì)齊方式為“居中對(duì)齊”。如圖8-19所示。實(shí)訓(xùn)任務(wù)

步驟４選擇表格的第一行單元格，合并單元格，并輸入“留言板”作為標(biāo)題，并設(shè)置其格式。步驟5

選擇表格第二行第一列單元格，設(shè)置其寬度為“83”像素，水平對(duì)齊方式為“右對(duì)齊”，垂直對(duì)齊方式為“居中”，在單元格內(nèi)輸入“用戶名：”，設(shè)置字體為“默認(rèn)字體”，大小為“14”。步驟6

選擇表格第二行第二列單元格，設(shè)置其寬度為“230”像素，水平對(duì)齊方式為“左對(duì)齊”，垂直對(duì)齊方式為“居中”，在此單元格中插入一個(gè)“文本字段”對(duì)象，在

面板中設(shè)置文本字段的屬性，文本域?yàn)椤皀ame”，類型為“單行”，字符寬度為“20”，最多字符數(shù)為“25”，初始值為“請(qǐng)輸入用戶名”。步驟7

在表格第三行前兩列中分別插入“密碼”和“文本字段”對(duì)象。其中“文本字段”對(duì)象屬性設(shè)為：文本域?yàn)椤皃assword”，類型為“密碼”，字符寬度為“20”，最多字符數(shù)為“10”。單元格屬性同上兩步。步驟8

在表格第四行前兩列中分別插入“性別”和“單選按鈕”對(duì)象。在文字“男”、“女”后分別插入兩個(gè)單選按鈕，如圖8-20所示。在“屬性面板”中對(duì)單選按鈕進(jìn)行設(shè)置，例如將“男”后的單選按鈕的“單選按鈕”、“選定值”和“初始狀態(tài)”依次設(shè)置為“sex”、“male”和“已勾選”，將“女”后的單選按鈕的“單選按鈕”、“選定值”和“初始狀態(tài)”依次設(shè)置為“sex”、“female”和“未選中”。單元格屬性同上。實(shí)訓(xùn)任務(wù)

步驟9

在表格第五行前兩列中分別插入“年齡”和“文本字段”對(duì)象。單元格屬性同上，“文本字段”對(duì)象屬性參照以上步驟自行設(shè)置。步驟10

在表格第六行前兩列中分別插入“所學(xué)專業(yè)”和“菜單/列表”對(duì)象。在“屬性面板”中對(duì)其進(jìn)行設(shè)置，“菜單/列表”、“類型”依次設(shè)置為“select”、“菜單”。在“列表值”中把“項(xiàng)目標(biāo)簽”、“值”分別設(shè)為：“計(jì)算機(jī)”、“0”，“數(shù)學(xué)”、“1”等。如圖8-21所示。單元格屬性同上。步驟11

合并表格第七行后兩列單元格，在前兩列單元格中分別插入“愛好”和“復(fù)選框”對(duì)象。在“上網(wǎng)”等文字后分別插入如圖8-22所示的復(fù)選框。在“屬性面板”中對(duì)復(fù)選按鈕進(jìn)行設(shè)置，例如將“上網(wǎng)”后的復(fù)選框的“復(fù)選框名稱”、“選定值”和“初始狀態(tài)”依次設(shè)定為“favor”、“net”和“未選中”，將“體育”后的復(fù)選框的“復(fù)選框名稱”、“選定值”和“