計算機網(wǎng)絡應用技能教程課件第6章 網(wǎng)頁制作基礎

返回主目錄第5章網(wǎng)絡安全技術6.1網(wǎng)頁制作的基礎知識6.2認識DreamWeaver6.3流媒體開發(fā)技術返回章目錄第6章網(wǎng)頁制作基礎6.4制作“我的大學”個人主頁返回章目錄第5章網(wǎng)絡安全技術工作任務：認識與網(wǎng)頁制作相關的一些基本概念及網(wǎng)頁的構成元素；認識網(wǎng)站設計開發(fā)的流程。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.1.1任務一認識網(wǎng)頁與網(wǎng)站

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．網(wǎng)頁與網(wǎng)站2．Web服務器與瀏覽器3．統(tǒng)一資源定位器（URL）4．網(wǎng)頁的基本元素返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術網(wǎng)頁也稱為Web頁，是人們通過瀏覽器瀏覽網(wǎng)絡資源時看到的頁面。每個網(wǎng)頁實際是一個文件，它存放在網(wǎng)絡服務器中。網(wǎng)頁經(jīng)由網(wǎng)址（URL）來識別與存取，當用戶在瀏覽器輸入網(wǎng)址后，經(jīng)過域名系統(tǒng)的解析，再通過瀏覽器解釋網(wǎng)頁的內(nèi)容，展示到用戶屏幕上。網(wǎng)頁通常由文字、表格、圖片、聲音、視頻及各種功能按鈕等組成。人們看到的網(wǎng)頁主要是以HTML擴展名結尾的表態(tài)網(wǎng)頁文件。還有其他類型的動態(tài)網(wǎng)頁文件，如CGI、ASP、PHP、JSP文件等。網(wǎng)頁與網(wǎng)站返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術網(wǎng)站是存放在網(wǎng)絡服務器上的完整信息的集合體，它包含一個或多個網(wǎng)頁，通過站內(nèi)鏈接把這些網(wǎng)頁有機結合起來，構成一個內(nèi)容完成、資源豐富的信息庫。網(wǎng)站的第一個頁面，通常稱為首面或主頁，它是整個網(wǎng)站的起始點和匯總點，是用戶開始瀏覽站點的“入口處”。一個網(wǎng)站主要有由域名（俗稱網(wǎng)址），網(wǎng)站空間和網(wǎng)站源程序三部分構成。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術Web技術的獨特之處是采用超鏈接和多媒體信息。Web服務器使用超文本標記語言描述網(wǎng)絡的資源，創(chuàng)建網(wǎng)頁，各種網(wǎng)站資源被保存在服務器上，以供Web瀏覽器閱讀。Web服務器管理著網(wǎng)絡中的各種資源，其基本功能是提供網(wǎng)絡通信服務、管理和提供網(wǎng)絡共享資源。Web瀏覽器（WebBrowser）是一個用于文檔檢索和顯示的客戶應用程序，并通過協(xié)議與Web服務器相連。目前，流行的InternetExplorer和NetscapeNavigator除提供基本的文檔檢索、顯示和導航特性外，還支持HTML的高級顯示（如表和幀）以及ActiveX、Java、JavaScript等特性。Web服務器與瀏覽器返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術是“UniformResourceLocator”的縮寫，即通常所說的網(wǎng)址，是指信息資源在Internet上的惟一地址，它提供在Web上訪問資源的惟一方法和路徑。統(tǒng)一資源定位器從左到右主要由Internet資源類型（WWW客戶程序用來操作的工具，如“http：//”表示W(wǎng)WW服務器，“ftp：//“表示FTP服務器，而“new：”表示Newgroup新聞組。）、服務器地址（指出WWW頁所在的服務器域名）、資源文件的位置（指明服務器上某資源的位置）組成。例如，黑龍江畜牧獸醫(yī)職業(yè)學院網(wǎng)址統(tǒng)一資源定位器（URL）返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術/index.asp中，http代表所使用的資源類型，服務器地址，index.asp為要訪問的主頁的路徑和文件名。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術設計網(wǎng)頁的目的主要是發(fā)布信息，超級鏈接是Web的核心，它將萬維網(wǎng)中無數(shù)的網(wǎng)頁鏈接在一起。網(wǎng)頁中包含多種元素，如圖6-1所示。文本：是網(wǎng)頁中常見的元素，是用來向用戶傳達信息的媒介。文字雖然不如圖像那樣能夠很快引起瀏覽者的注意，但卻能準確地表達消息的內(nèi)容和含義，為了克服文字固有的缺點，人們可以設置網(wǎng)頁文本的一些屬性，如字體、字號、顏色等，突出顯示重要的內(nèi)容。此外，用戶還可以在網(wǎng)頁中設計各種各樣的樣式，來清晰表達一系列項目。網(wǎng)頁的基本元素返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術圖片：圖片在網(wǎng)頁中具有提供信息、展示作品、裝飾網(wǎng)頁、表達個人情調(diào)和風格的作用。網(wǎng)頁中的圖片是GIF、JPEG、PNG等壓縮格式的圖片。在網(wǎng)頁中使用最廣泛的是JPEG和GIF格式，這倆種格式的圖片都可以在不同的操作系統(tǒng)支持的瀏覽器上顯示。動畫：網(wǎng)頁中使用動畫可使網(wǎng)頁效果更加突出，充分利用動畫的表現(xiàn)力使得網(wǎng)頁更加令人賞心悅目，同時，利用動畫也會增加網(wǎng)頁的交互功能。目前網(wǎng)頁中使用的動畫主要有GIF、Flash等。因Flash生成的文件較小，傳輸速度快，可以實現(xiàn)實時播放流，而不必等等整個文件傳輸完后傳輸完后再進行播放，該動畫流暢，功能較強，已成為業(yè)界動畫標準。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.1.2任務二網(wǎng)站設計與開發(fā)流程

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．定義站點2．建立網(wǎng)站結構3．確定網(wǎng)站的主題和建立網(wǎng)站結構風格4．設計網(wǎng)站的欄目和版塊5．設計和制作主頁及其他網(wǎng)頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術開發(fā)網(wǎng)站的首要工作就是要定義該站點。在該項工作中，要明確建立網(wǎng)站的目的，在站點建立的開始，要為站點制訂相應的目標，確定網(wǎng)站提供的內(nèi)容，以及搜集網(wǎng)站資料。定義站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術在此階段中，要規(guī)劃出網(wǎng)站的外觀及其工作方式。首先建立網(wǎng)站結構流程圖，在該流程圖中包括網(wǎng)站的所有關鍵頁面及其與其他網(wǎng)頁的關系，技術要點和主要的鏈接也應在其中給出。建立網(wǎng)站的結構時，將自己所希望的網(wǎng)頁內(nèi)容全部加入進去，然后再和其他參與網(wǎng)站開發(fā)的人員一起研究、討論，融入其他人員的意見。最后將網(wǎng)站結構圖確定下來。建立網(wǎng)站結構返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術設計一個網(wǎng)站，首先遇到的問題就是如何定位網(wǎng)站的主題。網(wǎng)站的主題也就是網(wǎng)站的題材。網(wǎng)站的題材主要有網(wǎng)上求職、網(wǎng)上聊天/即時信息、網(wǎng)上社區(qū)、娛樂、計算機技術、教育、生活等大類，每個大類都可以繼續(xù)細分，如娛樂類可再分為明星新聞、在線播放、在線游戲、下載電影等。還有一些是專業(yè)的題材，如中醫(yī)、天氣預報等，這里不再細分。對于題材的選擇，應注意以下3個問題：確定網(wǎng)站的主題和建立網(wǎng)站結構風格返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．主題要小而精。定位要小，內(nèi)容要精。不可以幻想制作一個包羅萬象的站點，而更應該突出特色。網(wǎng)站的最大特點就是新和快，目前最熱門的個人主頁都是天天更新甚至幾小時更新一次。網(wǎng)絡上的“主題站”比“萬全站”更受人們喜愛。2．題材最好是你自己擅長或者喜愛的內(nèi)容。例如，如果是平面設計人員，就可以建立一個平面設計之家網(wǎng)站；如果是一個教師，可以建立一個教學網(wǎng)站，及時反映教學情況和進行實時教學。這樣在制作時，才會激發(fā)個人的熱情，才不會覺得無聊或者力不從心，才能設計制作出優(yōu)秀的網(wǎng)站。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術網(wǎng)站的主題和風格確定完畢，在收集和組織了許多相關的資料內(nèi)容后，動手制作網(wǎng)站之前，一定要做好網(wǎng)站的規(guī)劃，確定合理的欄目版塊。欄目的實質(zhì)是一個網(wǎng)站的大綱索引，索引應該將網(wǎng)站的主體明確顯示出來。在制定欄目的時候，要仔細考慮，合理安排。網(wǎng)站欄目安排一定記住要緊扣主題，同時要設一個最近更新或網(wǎng)站指南欄目、設定一個可以雙向交流的欄目、設一個下載或常見問題回答欄目。設計網(wǎng)站的欄目和版塊返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術版塊比欄目的概念要大一些，每個版塊都有自己的欄目。例如中國教育和科研計算機網(wǎng)站點分中國教育、教育資源、科研發(fā)展、教育信息化等版塊，每個版塊下面有各有自己的主欄目。設置版塊應注意各版塊要有相對獨立性，各版塊要有相互關聯(lián)，版塊的內(nèi)容要圍繞站點主題。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術主頁的制作者需要先繪制一張草圖，草圖應包括網(wǎng)站的標志、廣告條、菜單、導航欄等一些基本元素。草圖設計好后，就可以開始動手制作主頁了。主頁制作好以后，就開始按著目錄結構設計和制作其他頁面，在制作中其他頁面要和主頁保持相同的風格，要有返回主頁的鏈接，目錄結構不要超過三層。設計和制作主頁及其他網(wǎng)頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術工作任務：安裝DreamWeaver8，啟動后熟悉其工作界面和編輯環(huán)境；認識靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁的基本概念及二者的區(qū)別；在網(wǎng)頁中輸入和編輯文本，插入圖象，插入影片和添加聲音，插入和編輯表格；創(chuàng)建和使用層；布局表格和單元格；在網(wǎng)頁中添加和刪除框架，設置框架屬性；認識CSS的概念，創(chuàng)建CSS樣式；創(chuàng)建與應用表單。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.1任務一熟悉DreamWeaver的工作環(huán)境

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術工作任務：安裝DreamWeaver8，啟動后熟悉其工作界面和編輯環(huán)境；認識靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁的基本概念及二者的區(qū)別；在網(wǎng)頁中輸入和編輯文本，插入圖象，插入影片和添加聲音，插入和編輯表格；創(chuàng)建和使用層；布局表格和單元格；在網(wǎng)頁中添加和刪除框架，設置框架屬性；認識CSS的概念，創(chuàng)建CSS樣式；創(chuàng)建與應用表單。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．安裝DreamWeaver82．熟悉DreamWeaver8的工作界面返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．運行DreamWeaver8安裝程序，出現(xiàn)“歡迎使用MacromediaDreamWeaver8InstallShieldWizard”界面2．單擊【下一步】按鈕，打開“許可證協(xié)議”對話框，如圖6-3所示。3．單擊【下一步】按鈕，彈出如圖6-4所示的“目標文件夾和快捷方式”對話框，單擊【更改】按鈕，彈出如圖

6-5所示的“更改當前目的地文件夾”對話框，選擇D盤為安裝路徑，單擊【確定】按鈕繼續(xù)。4．單擊【下一步】按鈕，彈出“默認編輯器”對話框安裝DreamWeaver8返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．單擊【下一步】按鈕，彈出“已做好安裝程序的準備”對話框，單擊【安裝】按鈕開始安裝程序。安裝完成后彈出“InstallShieldWizard完成”對話框，如圖6-7所示。單擊【完成】按鈕，完成程序的安裝。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．執(zhí)行【開始】→【所有程序】→【Macromedia】→【MacromediaDreamWeaver8】命令，啟動DreamWeaver軟件。（如果是第一次啟動，將會出現(xiàn)“工作區(qū)設置”對話框，如圖6-8所示，對于初學者，建議使用默認的“設計者”布局。）2．選擇設計器工作區(qū)，彈出“選擇建立文件類型”窗口熟悉DreamWeaver8的工作界面返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.2任務二熟悉DreamWeaver的編輯環(huán)境

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術主菜單：使用菜單欄基本上能夠?qū)崿F(xiàn)絕大部分功能。其功能包含在“文件”、“編輯”、“查看”、“插入”、“修改”、“文本”、“命令”、“站點”、“窗口”和“幫助”菜單中。插入工具欄：包含將各種類型的“對象”插入到文檔中的按鈕。每個對象都是一段HTML代碼，允許在插入時設置不同的屬性。默認的“插入”工具欄為“常用”工具欄，單擊“插入”按鈕，彈出下拉菜單，在下拉菜單中可以選擇其他工具欄。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術文檔工具欄：包含視圖轉(zhuǎn)換按鈕，這些按鈕可在文檔的不同視圖間快速切換。包括三個文檔視圖，分別是“代碼”視圖、“設計”視圖、“代碼和設計”視圖，。屬性面板：用于顯示所選中的網(wǎng)頁元素的屬性，并且可以在屬性面板上修改。選擇不同的網(wǎng)頁元素，屬性面板所顯示的內(nèi)容也有所不同。文檔窗口：用于顯示創(chuàng)建或編輯的文檔。有三種顯示模式，即設計視圖、代碼視圖、設計和代碼視圖，用戶可以根據(jù)需要使用文檔工具欄中的視圖按鈕隨意切換顯示模式。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.3任務三區(qū)別靜態(tài)網(wǎng)頁與動態(tài)網(wǎng)頁

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．靜態(tài)網(wǎng)頁2．動態(tài)網(wǎng)頁3．二者區(qū)別返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術靜態(tài)網(wǎng)頁是相對于動態(tài)網(wǎng)頁而言，是指沒有后臺數(shù)據(jù)庫、不含程序和不可交互的網(wǎng)頁，常見的擴展名為.htm、.html、.shtml、.xml，在靜態(tài)網(wǎng)頁上也可以出現(xiàn)各種動態(tài)的效果，如.gif格式的動畫、Flash動畫和滾動字幕等。靜態(tài)網(wǎng)頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術動態(tài)網(wǎng)頁是指網(wǎng)頁內(nèi)含有程序代碼，并會被服務器端執(zhí)行的網(wǎng)頁，常見的擴展名為.asp、.php、.jsp。靜態(tài)網(wǎng)頁是設計者做好的固定的網(wǎng)頁。動態(tài)網(wǎng)頁就是可以進行交互的網(wǎng)頁，它可以根據(jù)不同用戶的操作作出不同的反映。把用戶的不同的操作發(fā)送到服務器后用程序代碼進行處理。動態(tài)網(wǎng)頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術靜態(tài)網(wǎng)頁與動態(tài)網(wǎng)頁的區(qū)別在于Web服務器對它們的處理方式不同。當Web服務器接收到對靜態(tài)網(wǎng)頁的請求時，服務器直接將該頁發(fā)送給客戶瀏覽器，不進行任何處理。如果接收到對動態(tài)網(wǎng)頁的請求，則從Web服務器中找到該文件，并將它傳遞給一個稱為應用程序服務器的特殊軟件擴展，由它負責解釋和執(zhí)行網(wǎng)頁，將執(zhí)行后的結果傳遞給客戶瀏覽器。動態(tài)網(wǎng)頁以數(shù)據(jù)庫技術為基礎，可以大大降低網(wǎng)站維護的工作量。采用動態(tài)網(wǎng)頁技術的網(wǎng)站可以實現(xiàn)更多的功能，如用戶注冊、用戶登錄、搜索查詢、用戶管理、訂單管理等。動態(tài)網(wǎng)頁并不是獨立存在于服務器上的網(wǎng)頁文件，只有當用戶請求時服務器才返回一個完整的網(wǎng)頁。二者區(qū)別返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.4任務四網(wǎng)頁中文本與多媒體的處理

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．創(chuàng)建文檔并設置屬性2．處理網(wǎng)頁中的文本3．處理網(wǎng)頁中的圖像4．添加聲音5．插入Flash影片6．創(chuàng)建與管理超級鏈接返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.5任務五網(wǎng)頁布局技術

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．插入并編輯表格2．創(chuàng)建與使用層3．布局表格和布局單元格返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術插入表格：在文檔窗口中，將光標放在需要創(chuàng)建表格的位置，單擊【常用】快捷欄中的表格按鈕，彈出【表格】對話框，指定表格的屬性后，在文檔窗口中插入設置的表格。選擇單元格對象：選擇整個表格：把鼠標放在表格邊框的任意處，當出現(xiàn)這樣的標志時單擊即可選中整個表格，或在表格內(nèi)任意處單擊，然后在狀態(tài)欄選中<table>標簽即可。選中某一單元格：按住Ctrl鍵，鼠標在需要選中的單元格單擊即可。插入并編輯表格返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．將插入點放置在要創(chuàng)建層的地方。2．執(zhí)行【插入】→【布局對象】→【層】命令，在文檔中創(chuàng)建一個層，并在層中輸入文本“Hello”。3．選中層中文本，在文本的屬性面板中單擊居中對齊按按鈕，在【大小】下拉列表框中輸入70。4．選擇該層，在層的屬性面板的“寬”文本框中輸入300，“高”文本框中輸入80。創(chuàng)建與使用層返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．執(zhí)行【編輯】→【復制】命令，然后單擊文檔，執(zhí)行【編輯】→【粘貼】命令，這樣就制作出了兩個相同的層。6．選擇第一個層中的文本，將文本的屬性面板中的【文本顏色】設置為#99999。7．選擇其中任意一個層，用方向鍵將該層移動到適當?shù)奈恢谩?．保存并預覽網(wǎng)頁。創(chuàng)建與使用層返回章目錄第5章網(wǎng)絡安全技術1．單擊【布局】切換到布局視圖，激活【布局表格】和【布局單元格】按紐。2．單擊插入欄【布局】分類中的【繪制布局單元格】按鈕，將光標指向要繪制單元格的位置，然后拖動鼠標創(chuàng)建布局單元格。布局表格和布局單元格返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.6任務六應用框架

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．增加新框架2．刪除框架3．框架屬性返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術按住Ctrl鍵，將鼠標放在框架邊框上，當鼠標變?yōu)樯舷录^時，可把邊框拖到一個新位置，當松開鼠標按鈕時，一個新的空白內(nèi)容的框架就形成了。增加新框架返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術單擊該框架，執(zhí)行【框架】→【刪除框架】命令即可。刪除框架返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．選中框架，執(zhí)行【框架】→【框架屬性】，則彈出【框架屬性】對活框。2．在對話框的【名稱】文本框中輸入框架名；在【選項】區(qū)域中，若選中【在瀏覽器中可以調(diào)大小】復選框，則客戶在瀏覽站點時，可重新定義框架尺寸，通過在【顯示滾動條】下拉列表框中選擇不同的描述項，設置讓滾動條是否出現(xiàn)。3．在【框架大小】區(qū)域中，設置框架大小，定義一個絕對像素值或相對于瀏覽器窗口的百分比，若要用瀏覽器來設置相對于該頁面中框架的尺寸，選【相對】；在【邊距】區(qū)域中，設置內(nèi)容頁面與框架邊框分隔的像素數(shù)值。修改框架屬性返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．在【原始網(wǎng)頁】文本框中輸入一個新的頁面名字或URL。5．執(zhí)行【框架網(wǎng)頁】命令，則彈出【網(wǎng)頁屬性】對話框。6．在該對話框的【框架】選項卡中，在【框架間距】文本框中，可輸入以像素為單位的邊框?qū)挾?；若要使框架邊框消失，則不選中【顯示邊框】復選框。7．單擊【確定】按鈕，關閉【網(wǎng)頁屬性】對話框，再單擊【確定】按鈕，關閉【框架屬件】對話框，完成框架屬性設置。修改框架屬性返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.7任務七應用CSS樣式表

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．CSS概述2．創(chuàng)建新的

CSS

樣式返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術CSS技術，可以有效地對頁面的布局、字體、顏色、背景和其它效果實現(xiàn)更加精確的控制。

用CSS不僅可以做出美觀工整令瀏覽者賞心悅目的網(wǎng)頁，還能給網(wǎng)頁添加許多特殊效果。創(chuàng)建CSS樣式表的過程，就是對各種CSS屬性的設置過程，所以了解和掌握屬性設置非常重要。在DW

MX

2004的CSS樣式里包含了W3C規(guī)范定義的所有CSS1的屬性，把這些屬性分為：類型、背景、區(qū)塊、方框、邊框、列表、定位、擴展等八個部分。CSS概述返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．選擇插入的位置，執(zhí)行【新建

CSS

樣式】命令，彈出【新建

CSS

樣式】對話框。2．在【CSS

樣式】面板中，單擊面板右下角區(qū)域中的【新建

CSS

樣式】按鈕。3．在文本屬性檢查器中，執(zhí)行【管理樣式】命令，在彈出的對話框中單擊【新建】。

4．單擊【相關

CSS】選項卡，單擊右鍵，然后從菜單中選擇【新建規(guī)則】。

創(chuàng)建新的

CSS

樣式返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．執(zhí)行【文本】→【CSS

樣式→【新建】命令，彈出【新建

CSS

樣式】對話框。6．選擇要創(chuàng)建的

CSS

樣式的類型。7．選擇定義樣式的位置。8．單擊【確定】。創(chuàng)建新的

CSS

樣式返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.2.8任務八表單與行為的應用

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．創(chuàng)建表單2．添加文本域3．添加復選框4．單選按鈕及單選按鈕組5．添加行為返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．在打開的文檔中，將鼠標光標定位在要插入表單的位置。2．選擇【插入記錄】→【表單】→【表單】命令，即可以插入一個表單。創(chuàng)建表單返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．將鼠標光標定位在表單中要添加文本域的位置。2．在插入欄的【表單】選項卡中單擊按鈕，即可在指定位置添加文本域。添加文本域返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．將鼠標光標定位在要添加復選框的位置。2．在插入欄的【表單】選項卡中單擊按鈕，即可在指定位置添加復選框。添加復選框返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．將鼠標光標定位在要添加單選按鈕的位置。2．在插入欄的【表單】選項卡中單擊按鈕，在指定位置添加單選按鈕。若單擊按鈕，可打開【單選按鈕組】對話框，添加單選按鈕組。3．設置完成后，單擊【確定】按鈕。單選按鈕及單選按鈕組返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術按【Shift+F4添加行為】組合鍵打開【行為】面板。通過【行為】面板，將行為添加到頁面元素中，即可實現(xiàn)相應的操作。添加行為返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術工作任務：認識流媒體的概念，以及流媒體傳輸?shù)墓ぷ髟恚贿h程教學過程中流媒體傳輸技術的應用；認識Real流媒體處理技術的工作過程及原理。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.3.1任務一認識流媒體傳輸技術

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術流媒體：采用流式傳輸?shù)姆绞皆贗nternet播放的媒體格式，如音頻、視頻或多媒體文件。流媒體在播放前并不下載整個文件，只將開始部分內(nèi)容存入內(nèi)存，在計算機中對數(shù)據(jù)包進行緩存并使媒體數(shù)據(jù)正確地輸出。此時多媒體文件的剩余部分將在后臺的服務器內(nèi)繼續(xù)下載。與單純的下載方式相比，這種傳輸方式不僅使啟動延時大幅度地縮短，而且對系統(tǒng)緩存容量的需求也大大降低，并且極大地減少了用戶等待的時間。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.3.2任務二應用流媒體傳輸技術

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術在IP網(wǎng)上開展遠程教學活動，需要解決兩個基本問題：音頻、視頻流信息的傳送以及它們與數(shù)據(jù)之間的同步。流媒體技術在解決上述問題時有很大的優(yōu)勢。此外，由于在教學過程中教師會經(jīng)常使用電子教案來輔助教學，比如用PowerPoint，而電子教案的展示與音頻、視頻流之間有嚴格的時間同步關系，這就要求在傳輸過程中我們?nèi)匀灰３炙鼈冎g的同步關系。這里以Microsoft的WindowsMediaService例來分析基于IP網(wǎng)的遠程實時教學系統(tǒng)的基本構成和主要功能。返回章目錄第6章網(wǎng)頁制作基礎系統(tǒng)的工作過程如下：輸入的視頻和音頻信號將送給MPEG4的編碼器進行編碼，編碼器輸出的節(jié)目流既可以存入存儲設備也可以直接送給媒體服務器。媒體服務器的主要功能是完成節(jié)目流的播出。媒體服務器播出的節(jié)目有三個來源，它可能是保存在存儲設備中的ASF文件，也可以是Encoder實時傳送來的節(jié)目，其次，它播出的節(jié)目還可以從其它的媒體服務器上獲取。普通的用戶可以通過LAN或通過無線網(wǎng)絡接入到該系統(tǒng)之中參加遠程實時教學。第5章網(wǎng)絡安全技術返回章目錄6.3.3任務三熟悉Real流媒體處理技術

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術Real流媒體技術的實現(xiàn)需要3個軟件的支持。1．RealPlayer播放器。2．RealProducer編輯制作。3．RealServer服務器。RealPlayer：是媒體播放軟件，從早期的RealPlayer發(fā)展到RealPlayer8.0，RealPlayer9.0，現(xiàn)在已經(jīng)升級到RealOne和RealOnePlayerGold版本。Real所特有的格式為*.rm，*.ra，*.ram。所占空間小，并且有較好的影音質(zhì)量，應用廣泛。返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術工作任務：收集與大學生活相關的素材；設計網(wǎng)站的流程圖；在本地計算機上創(chuàng)建“mycollege”站點；編輯、刪除與復制站點；打開我的大學主頁，設置頁面屬性；在主頁中新建CSS樣式及CSS樣式文件；制作一個專題欄目，在該欄目下制作“我的大學”、“我的高中”、“我的初中”、“我的檔案”、“我的簡歷”、“社會生活”鏈接；為網(wǎng)頁設置背景音樂；在標志和標語區(qū)域插入一幅圖片；在圖片區(qū)域插入熱門圖片；在網(wǎng)頁中制作一個動態(tài)圖層，制作90幀的時間軸動畫；利用模板創(chuàng)建“個人檔案”、“相冊”、“音樂”三個欄目網(wǎng)頁；為網(wǎng)頁添加播放聲音行為；創(chuàng)建彈出信息對話框行為；設置添加狀態(tài)欄文本對話框行為；測試與發(fā)布網(wǎng)站。返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.1任務一收集素材與規(guī)劃網(wǎng)站

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．收集素材2．規(guī)劃網(wǎng)站返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術收集和我的大學網(wǎng)頁相關的素材，查找并收集有關的文字、圖片、聲音、影像等素材，并對所收集的素材進行整理、處理。根據(jù)網(wǎng)頁的需求，對素材進行編輯、處理。對圖片進行截取、編輯，并將圖片的格式轉(zhuǎn)換成JPG格式，文字材料進行重新編排，將聲音和影視資源轉(zhuǎn)換成RM或WMV等流媒體格式。收集素材返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術確定網(wǎng)站目標，通過本站的設計，展現(xiàn)學生在大學的學習、生活、事物等方面的情況，展現(xiàn)大學生的個性、風采和精神面貌，并具有實用性，能夠記錄學習的成績、科目、學習時間、學習心得和學習內(nèi)容等方面的內(nèi)容。規(guī)劃網(wǎng)站返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.2任務二創(chuàng)建和管理“我的大學”站點

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．建立一個站點2．管理與編輯站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的電腦”窗口，在D盤中新建一個文件夾mycollege。2．啟動DreamWeaver8軟件。執(zhí)行【站點】→【管理站點】命令，打開如圖6-16所示的“管理站點”對話框，單擊【新建】按鈕，選擇“站點”選項?！肮芾碚军c”對話框“站點定義”對話框

3．在彈出的“站點定義”對話框中輸入站點的名字“我的大學”建立一個站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．單擊【下一步】按鈕，在彈出的對話框中選擇“是，我想使用服務器技術”，在“哪種服務器技術？”下拉列表框中選擇“ASPVBscript”。5．單擊【下一步】按鈕，在彈出的對話框中選擇“在本地進行編輯和測試（我的測試服務器是這臺計算機）（E）”選項，在“您將把文件存儲在計算機上的什么位置？”文件夾列表選擇存放站點的位置為“D:\mycollege”文件夾建立一個站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術6．單擊【下一步】按鈕，在彈出的對話框中，在“您應該使用什么URL來瀏覽站點的根目錄”列表使用默認值（http://localhost）。選擇是否使用服務器技術選擇存放站點的位置對話框

7．單擊【下一步】按鈕，在彈出的對話框中選擇“否（O）”單選項。8．單擊【下一步】按鈕，在彈出的對話框中檢查各項設置是否正確。如果確認無誤，則單擊【完成】按鈕，完成“我的大學”個人站點的定義。在創(chuàng)建站點之后，在窗口右側的“文件”面板將會看到剛才定義的“我的大學”站點，目前該站點為，沒有任何文件和文件夾建立一個站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．執(zhí)行【站點】→【管理站點】命令“管理站點”對話框。2．選擇要重新編輯的站點名，單擊【編輯】按鈕，打開“站點定義”對話框，在該對話框中可以對站點重新編輯。3．單擊【確定】按鈕，返回“管理站點”對話框，單擊【完成】按鈕，完成編輯操作。管理與編輯站點返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．選擇要復制（本例選擇“我的大學”進行練習）的站點，單擊【復制】按鈕，即可復制一個站點。新復制的站點名顯示在“管理站點”對話框中。5．選擇要刪除的站點（“我的大學復制”），單擊【刪除】按鈕，彈出如圖6-23所示的“刪除提示”對話框。6．單擊【是（Y）】按鈕，即可刪除站點。管理與編輯站點返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.3任務三設置頁面屬性

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的大學”站點，打開index.asp網(wǎng)頁文件?！绊撁鎸傩浴睂υ捒?/p>

2．執(zhí)行【修改】→【頁面屬性】命令（或在工作窗口右鍵單擊，在彈出的快捷菜單中選擇“頁面屬性”選項）打開頁面屬性對話框。3．在“分類”列表中單擊“外觀”選項，設置“頁面字體”為宋體、“大小”為9、“文本顏色”為＃000000，左、右、上、下邊距均為0像素。設置頁面屬性返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．在“分類”列表中單擊“鏈接”選項，設置“活動鏈接”顏色為＃0000FF，“下劃線樣式”為始終無下劃線，如圖6-25所示。網(wǎng)頁中已訪問過的超級鏈接的文字顏色不變，正在訪問的超級鏈接的文字顏色為藍色，訪問過的鏈接不帶下劃線。5．在“分類”列表中單擊“標題/編碼”選項，設置標題為“個人主頁—我的大學”，如圖6-26所示。單擊【確定】完成“頁面屬性”的設置。6．執(zhí)行【文件】→【保存】命令，對修改后的網(wǎng)頁進行保存。設置頁面屬性返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.4任務四建立樣式表

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．創(chuàng)建CSS樣式2．創(chuàng)建CSS樣式文件返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的大學”站點，打開index.asp網(wǎng)頁文件。2．打開“設計”面板組中的“CSS樣式”面板，單擊面板右下方的“新建CSS規(guī)則”按鈕，打開“新建CSS樣式”對話框，如圖6-27所示。3．在“新建CSS規(guī)則”對話框中輸入名稱“標題”，選中“僅對該文檔”單選按鈕，如圖6-28所示，單擊【確定】按鈕。創(chuàng)建CSS樣式返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．在彈出的“標題的CSS規(guī)則定義”對話框中設置字體為黑體、大小為12px、顏色為＃FF0000，單擊【確定】按鈕完成標題CSS規(guī)則定義。5．單擊面板右下方的“新建CSS規(guī)則”按鈕，打開“新建CSS樣式”對話框，在“名稱”文本框中輸入正文單擊【確定】按鈕。6．在彈出的“正文的CSS規(guī)則定義”對話框中設置字體為宋體、大小為12px。創(chuàng)建CSS樣式返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的大學”站點，打開index.asp網(wǎng)頁文件。2．新建CSS規(guī)則，打開對話框，選擇定義在“（新建樣式表文件）”選項，單擊【確定】按鈕，彈出“保存樣式表文件為”對話框，在文件名后輸入“mycollege”。3．單擊新建的“mycollege”樣式表文件，新建欄目、標題、正文、版塊等樣式。創(chuàng)建CSS樣式文件返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.5任務五制作“我的大學”網(wǎng)站首頁

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的大學”站點，打開index.asp網(wǎng)頁文件?！拔业拇髮W”個人網(wǎng)站首頁

2．在“首頁”下方的單元格中輸入“專題欄目”，在“屬性”面板的單元格選項中設置“水平”為居中對齊，設置“垂直”為居中，設置“背景顏色”為#FFCC33。3．選擇中“專題欄目”文字。在“屬性”面板的樣式列表框中選擇“版塊”。4．在“專題欄目”文字前單擊，執(zhí)行【插入】→【圖像】命令，在彈出的“選擇圖像源文件”對話框中選擇“images”文件夾，選擇圖片“bj-3.gif”。單擊選中剛插入的圖片。設計版塊標題返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．分別在指定位置輸入各個版塊的名稱，即專題欄目、我的大學生活感悟、熱點文章、友情鏈接、熱點圖片、用戶登錄等各個版塊名稱，并且設置樣式為“版塊”，同時按照圖6-31所示，分別插入圖片“book1.gif”、“heart3.gif”、“bj-3.gif”、“1.gif”6．選擇“我的大學生活感悟”單元格，單擊“屬性”面板“背景”的單元格背景URL按鈕，在彈出的“選擇圖像源文件”對話框中選擇背景圖片為menu_bg.jpg。同樣，設置“熱點圖片”單元格的背景圖片也為menu_bg.jpg。設計版塊標題返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術7．設置“熱點文章”和“用戶登錄“單元格背景圖片為menu_l.jpg8．執(zhí)行【文件】→【保存】命令，把改進的內(nèi)容保存到文件中。設計版塊標題返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.6任務六修飾“我的大學”網(wǎng)站首頁

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．添加圖像2．設計動畫返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．繼續(xù)上一步的操作，單擊選中導航欄上面的單元格，執(zhí)行【插入】→【圖像】命令，在彈出的“選擇圖像源文件”對話框中選擇選擇圖片“zy-1.jpg”。單擊選中剛插入的圖片，在“屬性”面板的“對齊”列表框中選擇“絕對居中”。2．在熱點圖片下方的三個單元格中分別插入圖片“rm1.jpg”、“rm2.jpg”、“rm1.jpg”。3．執(zhí)行【文件】→【保存】命令，把改進的內(nèi)容保存到文件中。添加圖像返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．繼續(xù)上一步的操作，光標移動網(wǎng)頁的左上方，執(zhí)行【插入】→【布局對象】→【層】命令，在頁面上出現(xiàn)一個藍色的框，即圖層layer1。2．在框中輸入“歡迎來到“我的大學”個人網(wǎng)站！”，在“屬性”面板中設置“字體”為宋體加粗，“字號”為24。設置文字顏色為#FF0000，設置圖層的“背景顏色”為#99FFFF。3．執(zhí)行【窗口】→【時間軸】命令，打開“時間軸”面板，選中文字層layer1，把它拖到時間軸中。設計動畫返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術4．在時間軸上單擊鼠標選中第15幀，拖動該關鍵幀到第90幀。選擇文字圖層，拖運圖層到屏幕右上方，制作直線運動動畫。5．鼠標單擊第30幀，右鍵彈出快捷菜單，單擊【增加關鍵幀】，則第30幀變?yōu)殛P鍵幀，同樣，增加第60幀為關鍵幀。6．鼠標單擊第30幀，選擇文字圖層，拖運圖層到屏幕左下方。鼠標單擊第60幀，選擇文字圖層，拖運圖層到屏幕右下方。設計動畫返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術7．選中時間軸面板上自動播放復選框，使時間軸動畫在網(wǎng)頁打開時自動播放。8．執(zhí)行【文件】→【保存】命令，把改進的內(nèi)容保存到文件中。設計動畫返回章目錄第6章網(wǎng)頁制作基礎第5章網(wǎng)絡安全技術返回章目錄6.4.7任務七制作“我的大學”網(wǎng)站其他頁

返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．創(chuàng)建模板2．制作“個人檔案”頁3．制作“相冊”頁4．制作“音樂”頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．打開“我的大學”站點，打開index.asp網(wǎng)頁文件。“另存模板”對話框

2．執(zhí)行【文件】→【另存為模板】命令，打開“另存為模板”對話框，輸入模板名稱為mycollege，如圖6-32所示，單擊【保存】按鈕，在隨后彈出的提示框中選擇“是（Y）”按鈕以更新鏈接創(chuàng)建模板返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術3．在導航欄下方工作區(qū)中，單擊右健，在彈出的快捷菜單中執(zhí)行【模板】→【新建可編輯區(qū)域】命令（或執(zhí)行【插入】→【模板對象】→【可編輯區(qū)域】命令。4．在彈出的“新建可編輯區(qū)域”對話框中輸入名稱為Edit1，單擊【確定】按鈕。

5．執(zhí)行【文件】→【保存】命令，把改進的內(nèi)容保存到文件中，完成模板的創(chuàng)建。創(chuàng)建模板返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．啟動Dreamweaver程序，單擊“新建文檔”對話框。2．在該對話框中選擇“模板”選項卡，切換到“從模板新建”對話框。3．單擊選中“mycollege”模板，選中“當模板改變時更新頁面”復選框，單擊【創(chuàng)建】按鈕，利用模板創(chuàng)建一新的網(wǎng)頁。4．執(zhí)行【文件】→【另存為】命令，在彈出的另存為對話框中選擇“grda”文件夾，在文件名后的文本框中輸入“grda.html”，單擊【保存】按鈕保存網(wǎng)頁。制作“個人檔案”頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．制作一個6行1列的表格，分別設計并輸入“個人基本情況”、“興趣與特長”、“教育經(jīng)歷”等版塊標題，同時設置樣式為“版塊”。6．輸入表格內(nèi)容，調(diào)整表格至合適為止。7．執(zhí)行【文件】→【保存】命令，把改進的內(nèi)容保存到grda.html文件中。制作“個人檔案”頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．將要生成網(wǎng)頁相冊的圖像全部放在站點根文件夾外的一個文件夾中。2．在編輯窗口下執(zhí)行【命令】→【創(chuàng)建網(wǎng)站相冊】命令，彈出如圖6-35所示的文件夾。3．在“相冊標題”文本框中輸入網(wǎng)站相冊的標題為“世界各地美麗的風光”，設置網(wǎng)站相冊副標題為“美不勝收”。4．單擊“源圖像文件夾”后的【瀏覽】按鈕，在彈出的“請選擇一個文件夾”對話框中選擇源圖像所在的文件夾。制作“相冊”頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術5．單擊“目標文件夾”后的【瀏覽】按鈕，在彈出的“請選擇一個文件夾”對話框中設置放置網(wǎng)頁相冊的圖像和網(wǎng)頁的文件夾。6．在“縮略圖大小”列表框中設置縮略圖大小為100×100。7．選中“顯示文件名稱”前面的復選框，設置圖像下方顯示圖像的文件名。8．設置完畢后，單擊【確定】按鈕，自動優(yōu)化圖像，同時生成網(wǎng)頁文件。制作“相冊”頁返回章目錄第6章網(wǎng)頁制作基礎返回章目錄第5章網(wǎng)絡安全技術1．利用模板新建網(wǎng)頁另存為“yingyue.hmtl”。2．插入