大學(xué)計(jì)算機(jī)基礎(chǔ) 第9章

第9章網(wǎng)頁(yè)制作大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（微課版）COMPUTER目錄9.2

制作基本網(wǎng)頁(yè)CONTENTS9.1

網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（慕課版）9.3

使用表格布局網(wǎng)頁(yè)9.4

使用DIV+CSS統(tǒng)一網(wǎng)頁(yè)風(fēng)格9.5

使用表單和行為9.1.1

網(wǎng)頁(yè)與網(wǎng)站的概念網(wǎng)站：網(wǎng)站是指在互聯(lián)網(wǎng)上根據(jù)一定的規(guī)則，使用HTML（標(biāo)準(zhǔn)通用標(biāo)記語(yǔ)言）工具制作的用于展示特定內(nèi)容相關(guān)的一組網(wǎng)頁(yè)的集合。通常情況下，網(wǎng)站只有一個(gè)主頁(yè)，主頁(yè)中會(huì)包含該網(wǎng)站的標(biāo)志和指向其他頁(yè)面的鏈接，用戶(hù)可以通過(guò)網(wǎng)站來(lái)發(fā)布想要公開(kāi)的資訊，或者利用網(wǎng)站來(lái)提供相關(guān)的網(wǎng)絡(luò)服務(wù)。也可以通過(guò)網(wǎng)頁(yè)瀏覽器來(lái)訪問(wèn)網(wǎng)站，獲取自己需要的資訊或者享受網(wǎng)絡(luò)服務(wù)。網(wǎng)頁(yè)：網(wǎng)頁(yè)是組成網(wǎng)站的基本單元，用戶(hù)上網(wǎng)瀏覽的一個(gè)個(gè)頁(yè)面就是網(wǎng)頁(yè)。網(wǎng)頁(yè)又稱(chēng)為Web頁(yè)，一個(gè)網(wǎng)頁(yè)通常就是一個(gè)單獨(dú)的HTML文檔，其中包含有文字、圖像、聲音和超鏈接等元素。9.1.2網(wǎng)頁(yè)的構(gòu)成要素文字Logo導(dǎo)航超鏈接視頻音頻動(dòng)畫(huà)表單元素圖像9.1.3常見(jiàn)的網(wǎng)站類(lèi)型門(mén)戶(hù)網(wǎng)站個(gè)人網(wǎng)站職能網(wǎng)站企業(yè)網(wǎng)站專(zhuān)業(yè)網(wǎng)站9.1.4網(wǎng)站開(kāi)發(fā)的工具DreamweaverCC是集網(wǎng)頁(yè)制作和網(wǎng)站管理于一身的網(wǎng)頁(yè)編輯器，是第一套針對(duì)專(zhuān)業(yè)網(wǎng)頁(yè)設(shè)計(jì)師特別發(fā)展的視覺(jué)化網(wǎng)頁(yè)開(kāi)發(fā)工具，利用它可以輕而易舉地制作出跨越平臺(tái)限制和跨越瀏覽器限制的網(wǎng)頁(yè)。目錄9.2制作基本網(wǎng)頁(yè)CONTENTS9.1網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（慕課版）9.3

使用表格布局網(wǎng)頁(yè)9.4

使用DIV+CSS統(tǒng)一網(wǎng)頁(yè)風(fēng)格9.5

使用表單和行為9.2.1創(chuàng)建本地站點(diǎn)【例】創(chuàng)建一個(gè)名稱(chēng)為“wzsj”的本地站點(diǎn)。啟動(dòng)DreamweaverCC2019，選擇【站點(diǎn)】/【新建站點(diǎn)】命令，打開(kāi)“站點(diǎn)設(shè)置對(duì)象未命名站點(diǎn)1”對(duì)話框。在“站點(diǎn)名稱(chēng)”文本框中輸入站點(diǎn)名稱(chēng)，這里輸入“wzsj”，單擊對(duì)話框中的任一位置，確認(rèn)站點(diǎn)名稱(chēng)的輸入，此時(shí)對(duì)話框的名稱(chēng)會(huì)隨之而改變。在“本地站點(diǎn)文件夾”文本框后單擊“瀏覽文件夾”按鈕。打開(kāi)“選擇根文件夾”對(duì)話框，在該對(duì)話框中選擇存放站點(diǎn)的路徑，然后單擊按鈕。9.2.1創(chuàng)建本地站點(diǎn)返回到“站點(diǎn)設(shè)置對(duì)象wasj”對(duì)話框中，在“本地站點(diǎn)文件夾”對(duì)話框中則會(huì)顯示存儲(chǔ)站點(diǎn)的路徑，單擊按鈕。9.2.1創(chuàng)建本地站點(diǎn)返回DreamweaverCC2019主界面中，則會(huì)在“文件”面板中查看到創(chuàng)建的wzsj站點(diǎn)。9.2.2管理站點(diǎn)中的文件和文件夾添加文件或文件夾：網(wǎng)站內(nèi)容的分類(lèi)決定了站點(diǎn)中創(chuàng)建文件和文件夾的個(gè)數(shù)，通常，網(wǎng)站中每個(gè)分支的所有文件統(tǒng)一存放在單獨(dú)的文件夾中，根據(jù)網(wǎng)站的大小，又可進(jìn)行細(xì)分。移動(dòng)和復(fù)制文件或文件夾：新建文件或文件夾后，若對(duì)文件或文件夾的位置不滿(mǎn)意，可對(duì)其進(jìn)行移動(dòng)操作。刪除文件或文件夾：選中需刪除的文件或文件夾，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【編輯】/【刪除】命令，或直接按“Delete”鍵，在打開(kāi)的對(duì)話框中單擊“是”按鈕可刪除文件或文件夾。重命名文件或文件夾：選擇需重命名的文件或文件夾并單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【編輯】/【重命名】命令，使文件或文件夾的名稱(chēng)呈可編輯狀態(tài)，在可編輯的名稱(chēng)框中輸入新名稱(chēng)即可。9.2.3創(chuàng)建網(wǎng)頁(yè)基本元素【例】在“hhjj.html”網(wǎng)頁(yè)中輸入文本。打開(kāi)“hhjj.html”網(wǎng)頁(yè)文件，將插入點(diǎn)定位到內(nèi)側(cè)DIV中，輸入“花火植物家居館……”文本（具體內(nèi)容可參見(jiàn)提供的花火簡(jiǎn)介.txt素材），當(dāng)輸入完“進(jìn)出口等為一體的農(nóng)業(yè)產(chǎn)業(yè)化國(guó)家重點(diǎn)龍頭企業(yè)?！焙蟀础癊nter”鍵分段。1．在網(wǎng)頁(yè)中添加文本9.2.3創(chuàng)建網(wǎng)頁(yè)基本元素打開(kāi)“花火簡(jiǎn)介.txt”文件，選擇除第1段外的其他文本，按“Ctrl+C”組合鍵復(fù)制，返回“hhjj.html”網(wǎng)頁(yè)文件，然后按“Ctrl+V”組合鍵粘貼。9.2.3創(chuàng)建網(wǎng)頁(yè)基本元素（1）插入圖像在網(wǎng)頁(yè)恰當(dāng)?shù)奈恢貌迦雸D像，不但可以為網(wǎng)頁(yè)增彩增色，還可以使整個(gè)網(wǎng)頁(yè)更有說(shuō)服力，從而吸引更多瀏覽者。2．在網(wǎng)頁(yè)中添加圖像（2）插入鼠標(biāo)經(jīng)過(guò)圖像插入鼠標(biāo)經(jīng)過(guò)圖像，是指當(dāng)鼠標(biāo)經(jīng)過(guò)圖像時(shí)變化成另一張圖像，是網(wǎng)頁(yè)中較為常見(jiàn)的一種操作。選擇【插入】/【鼠標(biāo)經(jīng)過(guò)圖像】命令，打開(kāi)“插入鼠標(biāo)經(jīng)過(guò)圖像”對(duì)話框，在其中進(jìn)行設(shè)置。9.2.3創(chuàng)建網(wǎng)頁(yè)基本元素（1）插入HTML5VideoHTML5最重要的新特性就是對(duì)音頻和視頻的支持，如視頻的在線編輯、音頻的可視化構(gòu)造等。而HTML5Video元素是一種將視頻和電影嵌入到網(wǎng)頁(yè)中的一種標(biāo)準(zhǔn)樣式。（2）插入HTML5Audio音頻文件HTML5Audio是HTML5音頻元素提供的一種將音頻內(nèi)容嵌入網(wǎng)頁(yè)中的標(biāo)準(zhǔn)方式。同樣，HTML5音頻文件在插入時(shí)，只是以一個(gè)占位符的形式進(jìn)行顯示。3．在網(wǎng)頁(yè)中添加多媒體元素9.2.3創(chuàng)建網(wǎng)頁(yè)基本元素（3）插入并設(shè)置Flash文件的屬性動(dòng)態(tài)元素是一種重要的網(wǎng)頁(yè)元素，其中，F(xiàn)lash是使用最多的動(dòng)態(tài)元素之一。Flash元素表現(xiàn)力豐富，可以給人極強(qiáng)的視聽(tīng)感受。而且它的體積較小，可以被絕大多數(shù)瀏覽器支持，因此，被廣泛應(yīng)用于網(wǎng)頁(yè)中。（4）使用FlashVideo視頻文件Flash視頻即擴(kuò)展名為.flv的Flash文件，在網(wǎng)頁(yè)中插入Flash視頻的操作與插入Flash動(dòng)畫(huà)的方法類(lèi)似，插入Flash視頻后還可通過(guò)設(shè)置的控制按鈕來(lái)控制視頻的播放。9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接通過(guò)菜單命令：在需要插入超鏈接的位置選擇【插入】/【Hyperlink】命令，在打開(kāi)的“Hyperlink”對(duì)話框中進(jìn)行鏈接文本、鏈接文件和目標(biāo)打開(kāi)方式的設(shè)置。通過(guò)“屬性”面板：在網(wǎng)頁(yè)中選擇要?jiǎng)?chuàng)建超鏈接的文本，在“屬性”面板的“鏈接”下拉列表框中直接輸入鏈接的URL地址或完整的路徑和文件名即可1．創(chuàng)建文本超鏈接9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接通過(guò)“瀏覽文件”按鈕：?jiǎn)螕簟版溄印毕吕斜砜蚝蟮摹盀g覽文件”按鈕，在打開(kāi)的“選擇文件”對(duì)話框中選擇需要鏈接的文件，單擊按鈕即可鏈接，或按住“鏈接”下拉列表框后的“指向文件”按鈕，拖動(dòng)到右側(cè)的“文件”面板，并指向需要鏈接的文件即可。HTML代碼：切換到“代碼”或“拆分”視圖中，直接在<body></body>標(biāo)簽間輸入<ahref="鏈接路徑及名稱(chēng)">鏈接內(nèi)容</a>，如<ahref="">百度</a>，表示單擊“百度”文本，鏈接到百度網(wǎng)頁(yè)。9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接在網(wǎng)頁(yè)中創(chuàng)建圖像超鏈接與創(chuàng)建文本超鏈接的操作方法基本相同，都是先選擇需要?jiǎng)?chuàng)建超鏈接的對(duì)象，然后在“屬性”面板中設(shè)置圖像鏈接的路徑及名稱(chēng)。2．創(chuàng)建圖像超鏈接9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接熱點(diǎn)鏈接的原理是利用HTML語(yǔ)言在圖像上定義不同形狀的區(qū)域，然后再為這些區(qū)域添加鏈接，這些區(qū)域被稱(chēng)為熱點(diǎn)。在創(chuàng)建熱點(diǎn)鏈接時(shí)，需要先選擇需要?jiǎng)?chuàng)建熱點(diǎn)的圖像，再在“屬性”面板中選擇不同的熱點(diǎn)形狀，在圖像中繪制熱點(diǎn)區(qū)域后，在其“屬性”面板的“鏈接”文本框中輸入鏈接路徑或名稱(chēng)即可。3．創(chuàng)建熱點(diǎn)鏈接9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接通過(guò)菜單命令通過(guò)“插入”面板通過(guò)HTML代碼4．創(chuàng)建電子郵件超鏈接9.2.4創(chuàng)建網(wǎng)頁(yè)超鏈接下載超鏈接與其他超鏈接的不同之處在于鏈接的對(duì)象不是網(wǎng)頁(yè)而是一些單獨(dú)的文件。在單擊瀏覽器中無(wú)法顯示的鏈接文件時(shí)，會(huì)自動(dòng)打開(kāi)“文件下載”對(duì)話框。一般擴(kuò)展名為.gif或.jpg的圖像文件或文本文件（.txt）都可以在瀏覽器中直接顯示，但一些壓縮文件（.zip、.rar等）或可執(zhí)行文件（.exe）不可以顯示在瀏覽器中，因此，會(huì)打開(kāi)“文件下載”對(duì)話框進(jìn)行下載。5．創(chuàng)建下載超鏈接目錄9.2制作基本網(wǎng)頁(yè)CONTENTS9.1網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（慕課版）9.3使用表格布局網(wǎng)頁(yè)9.4

使用DIV+CSS統(tǒng)一網(wǎng)頁(yè)風(fēng)格9.5

使用表單和行為9.3.1插入表格并輸入內(nèi)容【例9】新建一個(gè)網(wǎng)頁(yè)文檔，在其中插入一個(gè)6行3列，寬度為954像素，邊框粗細(xì)為0像素的表格。新建“index.html”網(wǎng)頁(yè)，然后選擇【插入】/【Table】命令，打開(kāi)“Table”對(duì)話框，在其中進(jìn)行設(shè)置。9.3.1插入表格并輸入內(nèi)容單擊按鈕，即可在插入點(diǎn)處添加一個(gè)6行3列的表格。9.3.2表格的基本操作選擇需要調(diào)整大小的表格，將鼠標(biāo)光標(biāo)移動(dòng)至表格右側(cè)，當(dāng)鼠標(biāo)光標(biāo)變?yōu)榛蛐螤顣r(shí)，拖動(dòng)鼠標(biāo)即可改變表格的大小。1．調(diào)整表格大小將鼠標(biāo)光標(biāo)定位在單元格中，移動(dòng)鼠標(biāo)光標(biāo)，當(dāng)其移動(dòng)到行或列的相交處時(shí)，鼠標(biāo)光標(biāo)將變?yōu)榛蛐螤?，拖?dòng)鼠標(biāo)可調(diào)整單元格的大小。9.3.2表格的基本操作使用菜單命令：將鼠標(biāo)光標(biāo)定位到相應(yīng)的單元格中，選擇【編輯】/【表格】/【插入行】或【插入列】命令可在當(dāng)前選擇單元格的上面或左邊添加一行或列。使用右鍵菜單：將鼠標(biāo)光標(biāo)定位到相應(yīng)的單元格中，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【表格】/【插入行】或【插入列】命令，可實(shí)現(xiàn)單行或單列的插入使用對(duì)話框：將鼠標(biāo)光標(biāo)定位到相應(yīng)的單元格中，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【表格】/【插入行或列】命令，打開(kāi)“插入行或列”對(duì)話框，單擊選中“行”或“列”單選項(xiàng)，再設(shè)置插入的行數(shù)或列數(shù)及位置2.添加單元格行或列9.3.2表格的基本操作使用菜單命令：將鼠標(biāo)光標(biāo)定位到要?jiǎng)h除的行或列所在的單元格，選擇【編輯】/【表格】/【刪除行】或【編輯】/【表格】/【刪除列】命令。使用右鍵菜單：將鼠標(biāo)光標(biāo)定位到要?jiǎng)h除的行或列所在的單元格，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【表格】/【刪除行】或【表格】/【刪除列】命令。使用快捷鍵：使用鼠標(biāo)選擇要?jiǎng)h除的行或列，然后按【Delete】鍵。3.刪除單元格行或列9.3.2表格的基本操作使用菜單命令：選擇要合并的單元格區(qū)域，選擇【修改】/【表格】/【合并單元格】命令即可合并單元格。使用右鍵菜單：選擇要合并的單元格區(qū)域并單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【表格】/【合并單元格】命令即可。使用“屬性”面板：選擇要合并的單元格區(qū)域，單擊“屬性”面板左下角的“合并所選單元格”按鈕即可。4.合并單元格9.3.2表格的基本操作使用菜單命令：選擇要拆分的單元格，選擇菜單欄中的【修改】/【表格】/【拆分單元格】命令即可。使用右鍵菜單：選擇要拆分的單元格并單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇【表格】/【拆分單元格】命令即可。使用“屬性”面板：選擇要拆分的單元格，單擊“屬性”面板左下角的“拆分單元格為行或列”按鈕，打開(kāi)“拆分單元格”對(duì)話框，設(shè)置拆分的行或列數(shù)。5.拆分單元格9.3.3設(shè)置表格屬性如果不能熟練地使用HTML設(shè)置表格屬性，可通過(guò)選擇【窗口】/【屬性】命令，打開(kāi)“屬性”面板進(jìn)行可視化設(shè)置。并且表格“屬性”面板中的各參數(shù)設(shè)置與“Table”對(duì)話框中的參數(shù)基本相同。而在插入表格后，再使用表格“屬性”面板，則起到對(duì)插入的表格進(jìn)行相應(yīng)更改的作用。5.拆分單元格目錄9.2制作基本網(wǎng)頁(yè)CONTENTS9.1網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（慕課版）9.3使用表格布局網(wǎng)頁(yè)9.4使用DIV+CSS統(tǒng)一網(wǎng)頁(yè)風(fēng)格9.5

使用表單和行為9.4.1

CSS樣式的基本語(yǔ)法在每條CSS樣式中，都包含了兩個(gè)部分的規(guī)則：選擇器（選擇符）和聲明。選擇器就是用于選擇文檔中應(yīng)用樣式的元素，而聲明則是屬性及屬性值的組合。每個(gè)樣式表都是由一系列的規(guī)則組成的。但并不是每條樣式規(guī)則都出現(xiàn)在樣式表中。1.基本語(yǔ)法規(guī)則9.4.1

CSS樣式的基本語(yǔ)法在網(wǎng)頁(yè)中，如果想把一個(gè)CSS樣式引用到多個(gè)網(wǎng)頁(yè)元素中，則可使用多個(gè)選擇器，即在選擇器的位置引用多個(gè)選擇器名稱(chēng)，并且選擇器名稱(chēng)之間用逗號(hào)分隔。2.多個(gè)選擇器9.4.2創(chuàng)建樣式表在Dreamweaver中，將CSS樣式按照使用方法進(jìn)行分類(lèi)，可以分為內(nèi)部樣式和外部樣式。如果CSS樣式創(chuàng)建到網(wǎng)頁(yè)內(nèi)部，則可以選擇創(chuàng)建內(nèi)部樣式，但創(chuàng)建的內(nèi)部樣式只能應(yīng)用到一個(gè)網(wǎng)頁(yè)文檔中。如果想在其他網(wǎng)頁(yè)文檔中應(yīng)用，則需創(chuàng)建外部樣式。9.4.3認(rèn)識(shí)DIV標(biāo)簽DIV（Divsion）區(qū)塊，也可以稱(chēng)為容器，在Dreamweaver中使用DIV與其他HTML標(biāo)簽的方法。在布局設(shè)計(jì)中，DIV承載的是結(jié)構(gòu)，采用CSS可以有效地對(duì)頁(yè)面中的布局、文字等進(jìn)行精確的控制，DIV+CSS完美實(shí)現(xiàn)了結(jié)構(gòu)和表現(xiàn)的結(jié)合，對(duì)于傳統(tǒng)的表格布局是一個(gè)很大的沖擊。9.4.4認(rèn)識(shí)DIV+CSS布局模式DIV+CSS布局模式是根據(jù)CSS規(guī)則中涉及的margin（邊界）、border（邊框）、padding（填充）、content（內(nèi)容）來(lái)建立的一種網(wǎng)頁(yè)布局方法，如圖所示即為一個(gè)標(biāo)準(zhǔn)的DIV+CSS布局結(jié)構(gòu)，左側(cè)為代碼，右側(cè)為效果圖。9.4.5插入DIV標(biāo)簽在DreamweaverCC中插入DIV元素的方法相當(dāng)簡(jiǎn)單，只需定位插入點(diǎn)后，選擇【插入】/【Div】命令或選擇【插入】/【HTML】/【Div】命令，打開(kāi)“插入Div”對(duì)話框。9.4.6HTML5結(jié)構(gòu)在DreamweaverCC2019中，不僅可以單獨(dú)插入DIV元素，還可以使用HTML5元素插入有結(jié)構(gòu)的DIV元素。其結(jié)構(gòu)元素中包括畫(huà)布、頁(yè)眉、標(biāo)題、段落、導(dǎo)航、側(cè)邊、文章、章節(jié)、頁(yè)腳和圖等。目錄9.2制作基本網(wǎng)頁(yè)CONTENTS9.1網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)大學(xué)計(jì)算機(jī)基礎(chǔ)（Windows10+Office2016）（慕課版）9.3使用表格布局網(wǎng)頁(yè)9.4使用DIV+CSS統(tǒng)一網(wǎng)頁(yè)風(fēng)格9.5使用表單和行為9.5.1

認(rèn)識(shí)表單注冊(cè)網(wǎng)頁(yè)登錄網(wǎng)頁(yè)留言板或電子郵件網(wǎng)頁(yè)1.表單形式9.5.1

認(rèn)識(shí)表單在網(wǎng)頁(yè)中，組成表單樣式的各個(gè)元素稱(chēng)之為域。在DreamweaverCC2019的“插入”面板的“表單”分類(lèi)列表中，則可以看到表單中的所有元素。2.表單的組成要素9.5.1

認(rèn)識(shí)表單在HTML中，表單是使用<form></form>標(biāo)記表示的，并且表單中的各種元素都必須存在于該標(biāo)記之間，如圖所示的代碼表單，表示名為form1的表單，使用post方法提交到郵箱。3.HTML中的表單9.5.2

創(chuàng)建表單并設(shè)置屬性在DreamweaverCC2019中插入表單只需選擇【插入】/【表單】/【表單】命令或在“插入”面板的“表單”分類(lèi)列表中單擊“表單”按鈕，即可在網(wǎng)頁(yè)文檔中插入一個(gè)以紅色虛線顯示的表單。1.創(chuàng)建表單9.5.2

創(chuàng)建表單并設(shè)置屬性在網(wǎng)頁(yè)文檔中插入表單后，則會(huì)在“屬性”面板中顯示與表單相關(guān)的屬性，而通過(guò)表單“屬性”面板，則可對(duì)插入的表單進(jìn)行名稱(chēng)、處理方式以及表單的發(fā)送方法等設(shè)置。2.設(shè)置表單屬性9.5.3

插入表單元素文本輸入類(lèi)元素，主要包括常用的與文本相關(guān)的表單元素，如文本、電子郵件、密碼、Url、Tel、搜索、數(shù)字、范圍、顏色、月、周、日期、時(shí)間、日期時(shí)間、日期時(shí)間（當(dāng)?shù)兀┖臀谋緟^(qū)域等。1.文本輸入類(lèi)元素9.5.3

插入表單元素選擇元素單選按鈕和單選按鈕組元素復(fù)選框和復(fù)選框組元素2.選擇類(lèi)元素9.5.3

插入表單元素文件（File）元素可以在表單文檔中制作文件附加項(xiàng)目，由文本框和按鈕組成。單擊按鈕在打開(kāi)的對(duì)話框中可添加上傳的文件或圖像等，而文本框中則會(huì)顯示文件或圖像的路徑。3.文件元素按鈕和圖像域都有一個(gè)共同點(diǎn)，都可在單擊后與表單進(jìn)行交互。按鈕包括普通按鈕、提交按鈕和重置按鈕，而圖像域也可以稱(chēng)為圖像按鈕。4.按鈕和圖像域9.5.3

插入表單元素隱藏（Hidden）元素主要用于傳送一些不能讓用戶(hù)查看到的數(shù)據(jù)。在表單中插入隱藏元素后，是以圖標(biāo)顯示的，而且該元素只有