資源描述:
《Dreamweaver網(wǎng)頁設(shè)計案例教程 教學(xué)課件 作者 沈大林 等 第5章 表單、樣式表和命令.ppt》由會員上傳分享,免費在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫。
1、第5章表單、樣式表和命令5.1【案例28】“中國旅游協(xié)會會員登記表”網(wǎng)頁5.2【案例29】“跟我學(xué)制作表單”網(wǎng)頁(一)5.3【案例30】“CSS樣式表范例”網(wǎng)頁5.4【案例31】“特效值班表”網(wǎng)頁5.5【案例32】自定義命令5.1【案例28】“中國旅游協(xié)會會員登記表”網(wǎng)頁1.表單域和插入表單對象(1)創(chuàng)建與刪除表單域創(chuàng)建表單域:將光標移到要插入表單域的位置。單擊“插入”(表單)欄內(nèi)的【表單】按鈕,或用鼠標將“插入”(表單)欄內(nèi)的表單圖標拖曳到網(wǎng)頁文檔窗口內(nèi),即可在網(wǎng)頁設(shè)計窗口內(nèi)創(chuàng)建一個表單域,如圖所示。單擊表單域內(nèi)部,將光標移到表單域內(nèi),按回車鍵即可將表單域調(diào)大。按【
2、Backspace】鍵,可使表單域縮小。表單域在瀏覽器內(nèi)是看不到的。顯示表單域:在表單域創(chuàng)建后,若看不到表單域的矩形紅線,可以單擊選中“查看”→“可視化助理”→“不可見元素”菜單命令,即可將表單域的矩形紅線顯示出來。刪除表單域:單擊表單域的邊線處,選中表單域,按【Delete】鍵,可刪除表單域。(2)設(shè)置表單域的屬性單擊選中表單域,此時表單域“屬性”欄如圖所示。“表單名稱”文本框:在該文本框內(nèi)輸入表單域的名字。表單域的名字可用于JavaScript和VBScript等腳本語言中,這些腳本語言可控制表單域的屬性?!皠幼鳌蔽谋究蚝桶粹o:利用它們可以輸入腳本程序或含有腳本程
3、序的HTML文件?!胺椒ā毕吕斜砜颍河脕磉x擇客戶端與服務(wù)器之間傳送數(shù)據(jù)采用的方式。3個選項是:“默認”、“GET”(獲得,即追加表單值到URL,并發(fā)送服務(wù)器GET請求)和“POST”(傳遞,在消息正文中發(fā)送表單的值,并發(fā)送服務(wù)器POST請求)?!邦悺毕吕斜砜颍浩渲杏小爸孛?、“管理樣式”和創(chuàng)建的CSS樣式名稱等多個選項,可以用來選擇CSS樣式、給CSS樣式更名和創(chuàng)建新的CSS樣式等。(3)插入表單對象:將光標移到要插入表單對象的位置,然后單擊“插入”(表單)欄中的相應(yīng)按鈕,即可在光標處插入一個相應(yīng)的表單對象。另外,單擊“插入”→“表單”菜單命令,調(diào)出它的下一級菜
4、單。根據(jù)要插入的表單對象類別,單擊菜單內(nèi)的菜單命令也可插入表單對象。表單對象的“屬性”欄中都有一個名稱文本框,用來輸入表單對象的名稱,該名稱可在程序中使用,以指定表單對象。2.設(shè)置文本字段的屬性文本字段也叫文本域。表單中經(jīng)常使用文本字段。它可以是單行,也可以是多行,它用于接收文本、數(shù)字和字符。文本字段的“屬性”欄。如果選中了“類型”欄內(nèi)的“多行”單選按鈕,則“屬性”欄如圖所示。各選項的作用如下。(1)“字符寬度”文本框:文本域的寬度,即可顯示字符的最多個數(shù)。(2)“類型”欄:該欄有3個單選按鈕,用來選擇“單行”、“多行”或“密碼”文本域。密碼文本域的特點是:當(dāng)用戶輸入
5、文字時,密碼文本域內(nèi)顯示的不是這些文字,而是一行“*”。選擇“多行”單選按鈕時,其“屬性”欄會發(fā)生變化:“初始值”文本框變?yōu)閹L動條的多行文本框,同時“換行”下拉列表框變?yōu)橛行?,“字符寬度”文本框變?yōu)椤靶袛?shù)”文本框,用來輸入文本框的行數(shù)。(3)“最多字符數(shù)”文本框:允許輸入的字符個數(shù),可以比文本框?qū)挾却?。?)“初始值”文本框:用來輸入文本框的初始內(nèi)容。(5)“換行”下拉列表框:只有在選擇了“多行”類型后它才有效?!皳Q行”下拉列表框內(nèi)有4個選項,它們的含義如下。默認:采用瀏覽器的默認值。關(guān):當(dāng)輸入的文字超過文本框的寬度時,不換行,會出現(xiàn)滾動條。虛擬:當(dāng)輸入的文字超過文
6、本框的寬度時,會自動換行,但向服務(wù)器傳輸數(shù)據(jù)時無回車符。實體:當(dāng)輸入的文字超過文本框的寬度時,會自動加入回車符,換行。3.設(shè)置復(fù)選框和單選按鈕的屬性(1)設(shè)置復(fù)選框的屬性:復(fù)選框有選中和未選中兩種狀態(tài),多個復(fù)選框允許多選。它的“屬性”欄如圖所示,各選項的作用如下。“選定值”文本框:用來輸入復(fù)選框選中時的數(shù)值,通常為1或0?!俺跏紶顟B(tài)”欄:它有兩個單選按鈕,用來設(shè)置復(fù)選框的初始狀態(tài)。(2)設(shè)置單選按鈕的屬性:單選按鈕也叫單選項,一組單選按鈕中只允許選中一個。該“屬性”欄內(nèi)的選項與復(fù)選框“屬性”欄相應(yīng)選項的作用一樣。(3)設(shè)置單選按鈕組的屬性:單選按鈕組也叫單選項組。單擊
7、“插入”(表單)欄中的【單選按鈕組】按鈕,可調(diào)出“單選按鈕組”對話框。利用該對話框可以設(shè)置單選按鈕組中單選按鈕的個數(shù)、名稱和初始值。如果要增加選項,可單擊按鈕;如果要刪除選項,可單擊選中要刪除的選項,再單擊按鈕。如果要調(diào)整選項的顯示次序,可選中要移動的選項,再單擊或按鈕。4.設(shè)置按鈕的屬性按鈕用來制作【提交】和【重置】按鈕,還可以調(diào)用函數(shù)。它的“屬性”欄如圖所示,各選項的作用如下。(1)“標簽”文本框:用來輸入按鈕上的文字。(2)“動作”欄:它有3個單選按鈕,用來選擇單擊該選項后引起的動作類型。提交表單:選中它后,可以向服務(wù)器提交整個表單。重設(shè)表單: