frontpage課件

1、1/72FrontPage 2003 2/72 主要內(nèi)容主要內(nèi)容3/721.常用網(wǎng)頁制作軟件介紹常用網(wǎng)頁制作軟件介紹 用用HTMLHTML語言編寫的文件稱為語言編寫的文件稱為HTMLHTML文件，以頁面的形式呈文件，以頁面的形式呈現(xiàn)在用戶的屏幕上。現(xiàn)在用戶的屏幕上。4/72（1 1） Dreamweaver Dreamweaver： 所見即所得所見即所得 的網(wǎng)頁編輯工具；的網(wǎng)頁編輯工具；（2 2） FireworksFireworks：針對網(wǎng)絡圖形設計的工具軟件；：針對網(wǎng)絡圖形設計的工具軟件；（3 3） FlashFlash：矢量圖形編輯和交互式動畫制作軟件；：矢量圖形編輯和交互式動畫制作軟件

2、；網(wǎng)頁三劍客網(wǎng)頁三劍客11.常用網(wǎng)頁制作軟件介紹常用網(wǎng)頁制作軟件介紹 5/72 FrontPage 2003 FrontPage 2003是微軟公司最近推出的是微軟公司最近推出的Microsoft Microsoft Office SystemOffice System套裝軟件的重要組成部分。套裝軟件的重要組成部分。FrontPageFrontPage是一是一款所見即所得的網(wǎng)頁制作軟件，該軟件以其強大的向?qū)Ч钏娂此玫木W(wǎng)頁制作軟件，該軟件以其強大的向?qū)Чδ芎秃唵我子枚Q；能和簡單易用而著稱；FrontFrontPage 2003Page 2003 21.常用網(wǎng)頁制作軟件介紹常用網(wǎng)頁制作軟

3、件介紹 6/722. WWW 的基本知識的基本知識存放網(wǎng)頁的服務器存放網(wǎng)頁的服務器 。網(wǎng)頁的地址。網(wǎng)頁的地址。 基本結(jié)構(gòu)：服務器基本結(jié)構(gòu)：服務器 目錄目錄 文件名文件名7/72ASP（Active Server Pages)JSP (JavaServer Pages)PHP (Hypertext Preprocessor) 2. WWW 的基本知識的基本知識8/72 是網(wǎng)頁技術的基礎，它使用一些約定的標記（是網(wǎng)頁技術的基礎，它使用一些約定的標記（tagtag）對文對文本進行標注，定義網(wǎng)頁的數(shù)據(jù)格式，描述本進行標注，定義網(wǎng)頁的數(shù)據(jù)格式，描述WebWeb頁中的信息，頁中的信息，控制信息的顯示。控制

4、信息的顯示。 HTML HTML語言編寫的文件稱為語言編寫的文件稱為HTMLHTML文件文件。用。用HTMLHTML語言編寫的語言編寫的網(wǎng)頁實際上是一種文本文件，網(wǎng)頁實際上是一種文本文件，它以它以. .htmhtm或或.html.html為擴展名為擴展名，可以可以使用任何文本處理軟件（例如：記事本）編寫使用任何文本處理軟件（例如：記事本）編寫。3. HTML語言簡介語言簡介9/723. HTML語言簡介語言簡介10/723. HTML語言簡介語言簡介11/72（1 1）文本內(nèi)容：含有需要展現(xiàn)的具體信息。）文本內(nèi)容：含有需要展現(xiàn)的具體信息。（2 2）HTMLHTML標記：負責控制文本顯示的外觀和

5、版式。標記：負責控制文本顯示的外觀和版式。3. HTML語言簡介語言簡介12/72（1 1）標記名文本內(nèi)容標記名）標記名文本內(nèi)容標記名（2 2）標記名）標記名 屬性屬性1=1=值值1 1 屬性屬性2=2=值值2 2 文本內(nèi)容文本內(nèi)容 標記名標記名3. HTML語言簡介語言簡介標記名寫在標記名寫在“”內(nèi)。內(nèi)。多數(shù)多數(shù)HTMLHTML標記標記同時具有起始和結(jié)束標記，并且成對同時具有起始和結(jié)束標記，并且成對出現(xiàn)。出現(xiàn)。HTMLHTML標記不區(qū)分大小寫。標記不區(qū)分大小寫。其中標記名和屬性之間用其中標記名和屬性之間用空格分隔空格分隔。如果標記有多種屬性，屬性之間也要。如果標記有多種屬性，屬性之間也要用空

6、格分隔。用空格分隔。13/72 （1 1）頭部（頭部（HeadHead）：）：由由 head和和/head標記定義。標記定義。（2 2）正文主體（正文主體（BodyBody） ：由：由 body和和/body標記定義。標記定義。3. HTML語言簡介語言簡介3. HTML語言簡介語言簡介一般一般HTMLHTML文件都是以文件都是以開頭，以開頭，以結(jié)束。結(jié)束。1 1）頭部（頭部（HeadHead） H T M LH T M L 文 件 的 頭 部 由文 件 的 頭 部 由 和和 / h e a d 標 記 定 義 。標 記 定 義 。，它用于定義網(wǎng)頁文件的標題。，它用于定義網(wǎng)頁文件的標題。2 2

7、）正文主體（）正文主體（BodyBody）由由和和標記定義。標記定義。body =#n color=#n其中，其中，bgcolorbgcolor為背景顏色為背景顏色，colorcolor為文本顏色為文本顏色。n n為六位十六進制數(shù)為六位十六進制數(shù)。如果網(wǎng)頁使用背景圖像，格式如下：如果網(wǎng)頁使用背景圖像，格式如下：body 3. HTML語言簡介語言簡介 案例回顧案例回顧3. HTML語言簡介語言簡介標記格式標記格式字形結(jié)果字形結(jié)果/B 粗體粗體斜體斜體/U 下劃線下劃線上標上標下標下標3. HTML語言簡介語言簡介3. HTML語言簡介語言簡介3. HTML語言簡介語言簡介3. HTML語言簡介

8、語言簡介案例回顧案例回顧3. HTML語言簡介語言簡介22/723. HTML語言簡介語言簡介23/72 3. HTML語言簡介語言簡介24/72 3. HTML語言簡介語言簡介25/723. HTML語言簡介語言簡介26/724. FrontPage2003 應用應用27/724. FrontPage2003 應用應用標題欄菜單欄常用工具欄格式工具欄視圖欄標記欄工作區(qū)4. FrontPage2003 應用應用29/724. FrontPage2003 應用應用站點是指一個專門用來存放網(wǎng)站文件的站點是指一個專門用來存放網(wǎng)站文件的文件夾，需要一個名字和一個根目錄，以后文件夾，需要一個名字和一個根

9、目錄，以后所有站點的文件都將存放在這個根目錄下。所有站點的文件都將存放在這個根目錄下。30/724. FrontPage2003 應用應用站點的創(chuàng)建有以下幾種方法：站點的創(chuàng)建有以下幾種方法：利用向?qū)?chuàng)建利用向?qū)?chuàng)建 利用模板創(chuàng)建利用模板創(chuàng)建 12自定義站點自定義站點 34. FrontPage2003 應用應用32/72網(wǎng)網(wǎng)頁頁視視圖圖1文文件件夾夾視視圖圖2報報表表視視圖圖3導導航航視視圖圖4超超鏈鏈接接視視圖圖5任任務務視視圖圖6 網(wǎng)頁視圖是網(wǎng)頁視圖是FRONTPAGE 最常用的視圖最常用的視圖，網(wǎng)頁的創(chuàng)建，網(wǎng)頁的創(chuàng)建、編輯、預覽、編輯、預覽等都在該視圖等都在該視圖中進行。中進行。 文件夾

10、視圖文件夾視圖下，站點顯示下，站點顯示為一組文件和為一組文件和文件夾，可在文件夾，可在此視圖中創(chuàng)建此視圖中創(chuàng)建、移動和刪除、移動和刪除文件或文件夾文件或文件夾。 報表視圖可報表視圖可以方便的了解以方便的了解當前站點的文當前站點的文件內(nèi)容、更新件內(nèi)容、更新鏈接情況、組鏈接情況、組件錯誤，所有件錯誤，所有文件列表及變文件列表及變化情況?；闆r。 導航視圖可導航視圖可以方便地觀察以方便地觀察站點的鏈接結(jié)站點的鏈接結(jié)構(gòu)，以層狀組構(gòu)，以層狀組織結(jié)構(gòu)圖得形織結(jié)構(gòu)圖得形式顯示式顯示。 超鏈接視超鏈接視圖將當前站點圖將當前站點顯示為鏈接文顯示為鏈接文件的一個網(wǎng)絡件的一個網(wǎng)絡，它就象一張，它就象一張地圖，表明站

11、地圖，表明站點中的超級鏈點中的超級鏈接接 任務視圖任務視圖主要用來創(chuàng)建主要用來創(chuàng)建和管理任務，和管理任務，列出了當前站列出了當前站點尚未完成的點尚未完成的任務任務。4. FrontPage2003 應用應用33/72新建：新建：“文件文件”-“-“新建新建”-“-“新建新建”任務窗格任務窗格-“-“新建網(wǎng)頁新建網(wǎng)頁”-“-“其他網(wǎng)頁模板其他網(wǎng)頁模板”。打開：打開：“文件文件”-“-“打開打開”或或“常用常用”工具欄的工具欄的“打開打開”按鈕，在彈出的按鈕，在彈出的“打開文件打開文件”對話框中選擇相應的網(wǎng)頁；對話框中選擇相應的網(wǎng)頁；如需要打開的文件已在打開的網(wǎng)站中，在文件夾視圖中雙擊如需要打開的

12、文件已在打開的網(wǎng)站中，在文件夾視圖中雙擊該網(wǎng)頁圖標即可將其打開。該網(wǎng)頁圖標即可將其打開。保存：保存：“文件文件”-“-“保存保存”或或“常用常用”工具欄的工具欄的“保存保存”按按鈕，如需另存可使用鈕，如需另存可使用“文件文件”菜單的菜單的“另存為另存為”命令。命令。4. FrontPage2003 應用應用4. FrontPage2003 應用應用4. FrontPage2003 應用應用36/72在在FrontPage2003FrontPage2003中預覽網(wǎng)頁中預覽網(wǎng)頁1在瀏覽器中預覽網(wǎng)頁在瀏覽器中預覽網(wǎng)頁24. FrontPage2003 應用應用37/72 插入水平線插入水平線14.

13、FrontPage2003 應用應用 “插入插入”-“-“水平線水平線”修改：修改：u雙擊水平線雙擊水平線u選中水平線右鍵水平線屬性選中水平線右鍵水平線屬性38/72 插入圖像插入圖像24. FrontPage2003 應用應用“插入插入”-“-“圖片圖片”設置圖片屬性設置圖片屬性雙擊雙擊圖片圖片選中選中圖片圖片-格式格式-屬性屬性選中選中圖片圖片右鍵右鍵圖片圖片屬性屬性編輯圖片編輯圖片利用圖片工具欄旋轉(zhuǎn)等利用圖片工具欄旋轉(zhuǎn)等39/72 插入字幕 34. FrontPage2003 應用應用40/72 插入交互式按鈕插入交互式按鈕44. FrontPage2003 應用應用 “ “插入插入”-

14、“Web-“Web組件組件”-“-“組件類型組件類型”-“-“動態(tài)效果動態(tài)效果”-“-“選擇一種效果選擇一種效果”-“-“交互式按鈕交互式按鈕”-“-“完成完成” 設置按鈕設置按鈕 字體字體 圖像圖像 鏈接鏈接41/72 插入站點計數(shù)器插入站點計數(shù)器54. FrontPage2003 應用應用“插入插入”-“Web-“Web組件組件”-“-“插入插入WebWeb組件組件”-“-“組件類型組件類型”-“計數(shù)器計數(shù)器”-“-“選擇計數(shù)器樣式選擇計數(shù)器樣式”-“-“完成完成”-“-“計數(shù)器屬性計數(shù)器屬性”42/72建立文本超級鏈接建立文本超級鏈接14. FrontPage2003 應用應用（2 2）

15、“插入超鏈接插入超鏈接”對話框中選擇要鏈接的目標網(wǎng)頁，單擊對話框中選擇要鏈接的目標網(wǎng)頁，單擊“確定確定”按鈕按鈕43/72建立圖像超級鏈接建立圖像超級鏈接24. FrontPage2003 應用應用4. FrontPage2003 應用應用1.1.選擇需要添加熱點的圖片在選擇需要添加熱點的圖片在“圖片圖片”工具欄上，單擊長工具欄上，單擊長方形、圓形或多邊形熱點按鈕匹配需要的形狀。方形、圓形或多邊形熱點按鈕匹配需要的形狀。2.2.在圖片上，在圖片上，采用鼠標拖動操作畫出所選形狀采用鼠標拖動操作畫出所選形狀。畫多邊形。畫多邊形時，可單擊多邊形的第一個角，然后依次單擊多邊形其他時，可單擊多邊形的第一

16、個角，然后依次單擊多邊形其他角的位置，最后雙擊完成多邊形。角的位置，最后雙擊完成多邊形。3.3.釋放鼠標，彈出釋放鼠標，彈出“插入超鏈接插入超鏈接”對話框，按照插入超鏈對話框，按照插入超鏈接中所講方法創(chuàng)建超鏈接即可。接中所講方法創(chuàng)建超鏈接即可。3建立熱點超級鏈接建立熱點超級鏈接45/72書簽超級鏈接書簽超級鏈接44. FrontPage2003 應用應用應用書簽能夠更嚴格地控制用戶到達網(wǎng)頁內(nèi)的某個具體位置。應用書簽能夠更嚴格地控制用戶到達網(wǎng)頁內(nèi)的某個具體位置。書簽是網(wǎng)頁中被標記的位置或被標記的文本。書簽是網(wǎng)頁中被標記的位置或被標記的文本。1 1）插入書簽）插入書簽（1 1）選中作為書簽的文本，

17、或?qū)⒐鈽硕ㄎ辉谝迦霑灥奈恢谩＃┻x中作為書簽的文本，或?qū)⒐鈽硕ㄎ辉谝迦霑灥奈恢谩＃? 2） “插入插入”-“-“書簽書簽”-“-“確定確定”2 2）創(chuàng)建書簽超鏈接）創(chuàng)建書簽超鏈接（1 1）選定要定義超鏈接的文本或圖片；）選定要定義超鏈接的文本或圖片；（2 2）“插入插入”-“-“超鏈接超鏈接”命令，命令，-“-“鏈接到鏈接到”-“-“本文本文檔中的位置檔中的位置”，選擇要鏈接的書簽；，選擇要鏈接的書簽；-“-“確定確定”46/72創(chuàng)建電子郵件鏈接創(chuàng)建電子郵件鏈接54. FrontPage2003 應用應用（1 1）選擇作為電子郵件超鏈接的文本或圖片；）選擇作為電子郵件超鏈接的文本或圖片；

18、（2 2）“插入插入”-“-“超鏈接超鏈接”-“-“鏈接到鏈接到”-“-“電子郵件地址電子郵件地址”-“-“確定確定”。47/72下載文件超級鏈接下載文件超級鏈接64. FrontPage2003 應用應用（1 1）選擇作為文件超鏈接的文本或圖片；）選擇作為文件超鏈接的文本或圖片；（2 2）“插入插入”-“-“超鏈接超鏈接”-“-“選擇一個壓縮選擇一個壓縮文件文件”-“-“確定確定”。 4. FrontPage2003 應用應用2. 2. 設置表格屬性設置表格屬性 將光標定位到表格內(nèi)部或選中表格將光標定位到表格內(nèi)部或選中表格,“,“表格表格”-“-“表格屬表格屬性性”“”“表格表格”3. 3.

19、 設置單元格屬性設置單元格屬性 將光標定位到單元格將光標定位到單元格,“,“表格表格”-“-“表格屬性表格屬性”單元格單元格表格的其他操作（插入、刪除、調(diào)整等）類似與表格的其他操作（插入、刪除、調(diào)整等）類似與word2003word2003！49/72v單元格間距單元格間距v邊框粗細（通常設為邊框粗細（通常設為0 0）v單元格邊距（通常設為單元格邊距（通常設為0 0）幾個概念幾個概念1表格與單元格屬性表格與單元格屬性2表格的相關操作表格的相關操作3 插入表格、插入刪除插入表格、插入刪除行和列、行高與列寬的調(diào)行和列、行高與列寬的調(diào)整、合并與拆分單元格。整、合并與拆分單元格。4. FrontPag

20、e2003 應用應用50/72 4. FrontPage2003 應用應用51/72 在在FRONTPAGE中，可以把一個瀏中，可以把一個瀏覽器窗口分成幾個區(qū)域，每一個部分可覽器窗口分成幾個區(qū)域，每一個部分可以顯示不同的網(wǎng)頁。以顯示不同的網(wǎng)頁。4. FrontPage2003 應用應用52/72 4. FrontPage2003 應用應用4. FrontPage2003 應用應用1. 1. 創(chuàng)建框架網(wǎng)頁創(chuàng)建框架網(wǎng)頁2. 2. 保存框架網(wǎng)頁保存框架網(wǎng)頁3. 3. 拆分框架拆分框架4. FrontPage2003 應用應用4. FrontPage2003 應用應用4. 4. 刪除框架刪除框架選擇要

21、刪除的框架，選擇要刪除的框架，“框架框架” “ “刪除框架刪除框架”5. 5. 設置框架屬性設置框架屬性4. FrontPage2003 應用應用57/72表單的組成表單的組成14. FrontPage2003 應用應用58/72插入文本框插入文本框24. FrontPage2003 應用應用59/72插入文本區(qū)插入文本區(qū)34. FrontPage2003 應用應用與文本框的不同之處在于文本區(qū)中可以接受多行文本與文本框的不同之處在于文本區(qū)中可以接受多行文本“插入插入”-“表單表單”-“文本區(qū)文本區(qū)”60/72插入復選框插入復選框44. FrontPage2003 應用應用 將光標放在要插入復選

22、框的位置，將光標放在要插入復選框的位置，“插入插入”-“表單表單”-“復選框復選框”在復選框旁鍵入文字進行說明在復選框旁鍵入文字進行說明61/72插入選項按鈕插入選項按鈕54. FrontPage2003 應用應用將光標放在要插入選項按鈕的位置，將光標放在要插入選項按鈕的位置，“插入插入”-“表單表單”-“選項按鈕選項按鈕”?！斑x項按鈕屬性選項按鈕屬性”對話框中，對話框中，“組名稱組名稱”用來設用來設置此選項按鈕所屬組的名稱，如果把多個選項按置此選項按鈕所屬組的名稱，如果把多個選項按鈕編成一組，必須使它們的組名稱相同。鈕編成一組，必須使它們的組名稱相同。62/72插入分組框插入分組框64. FrontPage2003 應用應用將一組相關的控件或文本與網(wǎng)頁或當前表單中的其他信將一組相關的控件或文本與網(wǎng)頁或當前表單