網(wǎng)頁設(shè)計與制作 第2章

1、標題欄菜單欄工具欄編輯窗口滾動條視圖欄一、創(chuàng)建站點 創(chuàng)建一個空站點，其中并不包含任何內(nèi)容和信息，即搭起一個架子。 操作步驟： 1)在 “文件” 菜單上指向 “新建”，然后單擊 “站點”。 2)在 “站點” 列表中，選擇用來創(chuàng)建新站點的模板。 3)在 “指定新網(wǎng)站的位置” 框中鍵入或選擇新站點名稱。 FrontPage 將自動為站點創(chuàng)建下列文件和文件夾： 1)用來存放圖片、視頻和其他的圖像文件夾(Image)。 2)用來存放表單結(jié)果和其他任何不想被瀏覽站點的站點訪問者看到的文件的 _private 文件夾。 3)將根據(jù)站點所使用的服務(wù)器類型創(chuàng)建一個名為 Index.htm 或 Default.h

2、tm 的新主頁。 4)如果將圖片文件粘貼到網(wǎng)頁上，當在保存站點時， FrontPage 將根據(jù)圖片類型提示將圖片保存為 GIF 或 JPEG 的格式。 二、創(chuàng)建、刪除網(wǎng)頁和文件夾 1、各類模板可以創(chuàng)建不同種類的網(wǎng)頁： 創(chuàng)建空白網(wǎng)頁。 創(chuàng)建帶有特定布局的網(wǎng)頁，例如帶有多重欄的網(wǎng)頁。 為特定功能創(chuàng)建的網(wǎng)頁，例如目錄、搜索表單等等。 使用多種框架格式之一創(chuàng)建框架網(wǎng)頁。 操作步驟： 在 “文件” 菜單上指向 “新建”，然后單擊 “網(wǎng)頁”；單擊想使用的模板選項卡，然后單擊模板（該模板的縮略圖，或來自該向?qū)У妮敵?，就會顯示在 “預覽” 區(qū)域）。 2、在文件夾列表內(nèi)創(chuàng)建一個新網(wǎng)頁是一種可以在站點上添加網(wǎng)頁的

3、簡單方法： 于“文件夾列表”內(nèi)，在想創(chuàng)建新網(wǎng)頁的文件夾上，單擊右鍵，然后于快捷菜單上單擊 “新建網(wǎng)頁” ；鍵入新網(wǎng)頁的名稱，再單擊 Enter 鍵。 3、創(chuàng)建文件夾 也可以在站點中創(chuàng)建一個新文件夾來組織網(wǎng)頁和文件。例如：可會創(chuàng)建一個名為 Multimedia 的文件夾來存放聲音效果、視頻等對象。 在 “文件夾列表” 中單擊鼠標右鍵，然后單擊快捷菜單中 “新建文件夾”；鍵入新文件夾名稱，然后按 “確定” 鍵。 4、保存網(wǎng)頁 如果之前網(wǎng)頁尚未保存，單擊 “保存文件” ；在站點中找到要保存網(wǎng)頁的位置，然后在 “文件名” 框中鍵入網(wǎng)頁的文件名稱， 單擊 “保存”。 如果網(wǎng)頁從當前站點中打開，單擊 “保

4、存文件” 。 如果網(wǎng)頁從當前站點外打開，單擊 “文件” 菜單中的 “另存為”。在站點中找到要保存網(wǎng)頁的位置，然后在 “文件名” 框中鍵入網(wǎng)頁的文件名稱， 單擊 “保存”。 注意：如果在網(wǎng)頁中添加圖形、 ActiveX 控件、聲音文件或其他對象，系統(tǒng)會提示將其保存在與網(wǎng)頁相同的位置。 5、從當前站點中刪除網(wǎng)頁 在文件夾視圖模式下，選擇網(wǎng)頁后單擊 Delete。 6、在 Web 瀏覽器中預覽網(wǎng)頁 如果已經(jīng)在計算機上安裝 Microsoft Internet Explorer 3.0 以上版本，可單擊網(wǎng)頁視圖模式下的 “預覽”選項卡或“文件” 菜單上的 “在瀏覽器中預覽” ，來快速預覽當前網(wǎng)頁。 若

5、要以站點訪問者用站點瀏覽器瀏覽的角度來正確預覽網(wǎng)頁的話，就應該先保存網(wǎng)頁?？梢詫?Microsoft FrontPage 設(shè)置成預覽網(wǎng)頁前自動保存。 單擊 “文件” 菜單上的 “在瀏覽器中預覽”，然后選擇 “自動保存網(wǎng)頁” 復選框。（快捷鍵 Ctrl + Shift + B）三、資源管理器視圖 1、網(wǎng)頁視圖 該視圖中主要用來制作網(wǎng)頁。 2、文件夾視圖 該視圖中列出了站點中的所有文件，能看到文件名稱、標題、大小、類型、修改日期等。 3、報表視圖 該視圖列出了圖片、未鏈接的超級鏈、未完成任務(wù)等項目，有助于更塊查找網(wǎng)頁中不容易發(fā)現(xiàn)的錯誤以迅速改正。 4、導航視圖 該視圖顯示整個網(wǎng)站的組織結(jié)構(gòu)和各個網(wǎng)

6、頁之間的關(guān)系，即注重的是層次關(guān)系。 5、超鏈接視圖 該視圖中清晰的顯示出站點中所有靈活的超鏈接，即只是單純顯示網(wǎng)頁之間的鏈接關(guān)系，可以無限展開。 6、任務(wù)視圖 該視圖可以維護一個動態(tài)的項目表，可以協(xié)調(diào)工作內(nèi)容、工作進度等。四、網(wǎng)頁格式 1、設(shè)置網(wǎng)頁背景顏色 操作步驟：在網(wǎng)頁視圖模式下，右鍵單擊網(wǎng)頁，再單擊快捷菜單中的 “網(wǎng)頁屬性”，然后單擊 “背景” 選項卡。 在 “背景” 框中，選擇一種背景顏色。 2、設(shè)置網(wǎng)頁背景圖片 可以使用站點、文件系統(tǒng)、全球廣域網(wǎng)或剪貼畫中圖片。 操作步驟： a、在網(wǎng)頁視圖模式下，右鍵單擊網(wǎng)頁，然后單擊快捷菜單中的 “網(wǎng)頁屬性”。 b、單擊 “背景” 選項卡。 c、選

7、擇 “背景圖片” 復選框，然后單擊 “瀏覽”。 選擇背景圖片： 如果圖片在站點中，在包含此圖片的站點和文件夾中瀏覽，選擇所需的圖片，然后單擊 “確定”。 如果圖片在局域網(wǎng)上，單擊 “從計算機上選擇一個文件”，在局域網(wǎng)上瀏覽找到此圖片，然后單擊 “確定”。 如果圖片在全球廣域網(wǎng)上，單擊 “使用 Web 瀏覽器來選擇網(wǎng)頁或文件”。在Web 瀏覽器中，瀏覽到所需的圖片，然后回到FrontPage 。訪問過的網(wǎng)頁位置就會顯示在 “URL” 框中，單擊 “確定”。 如果圖片為剪貼畫，單擊 “剪貼畫” 來顯示 Microsoft 剪貼庫，選中所需的圖片，單擊鼠標右鍵，然后單擊快捷菜單中的 “插入”。 也可

8、以將背景圖片設(shè)置為水印，即此圖片不會像網(wǎng)頁一樣滾動。然而，并非所有的 Web 瀏覽器都支持水印。 3、將一個網(wǎng)頁的背景和顏色應用于另一個網(wǎng)頁 操作步驟： 在網(wǎng)頁視圖模式下，打開想要應用背景和顏色的網(wǎng)頁。 右鍵單擊網(wǎng)頁，然后單擊快捷菜單中的 “網(wǎng)頁屬性”。 單擊 “背景” 選項卡， 選擇 “從另一網(wǎng)頁獲得背景信息” 復選框。 單擊 “瀏覽”， 選擇包含使用的背景和顏色的網(wǎng)頁。 4、設(shè)置網(wǎng)頁邊距 可以設(shè)置網(wǎng)頁的上邊距和左邊距。 操作步驟：在網(wǎng)頁視圖模式下，右鍵單擊網(wǎng)頁，然后單擊快捷菜單中的 “網(wǎng)頁屬性”。 單擊 “邊距” 選項卡。 要設(shè)置上邊距，選擇 “指定上邊距” 復選框，然后鍵入邊距高度的像素

9、值。 要設(shè)置左邊距，選擇 “指定左邊距” 復選框，然后鍵入邊距寬度的像素值。 5、設(shè)置網(wǎng)頁文本格式 可以象使用字處理軟件（word或wps）一樣的方式來設(shè)置文本格式，從而增強可見的組織性、重點強調(diào)和結(jié)構(gòu)。如：更改字體、大小、樣式、顏色、段落間距等。 1）文本的編輯 輸入文本 復制文本 （ 快捷鍵Ctrl + C） 粘貼文本 （ 快捷鍵Ctrl + V） 剪切文本、刪除文本：均是將文字從文檔中除去，而剪切文本會在剪貼板中復制一份。 2）設(shè)置文本字體（ 快捷鍵 Alt + Enter） 可以通過選擇文本字形、樣式、大小和顏色來設(shè)置所選文本的字體；也可以將不同的效果應用到文本，例如刪除線和小型大寫字

10、母。 在網(wǎng)頁視圖模式下，選擇要設(shè)置其格式的文本，單擊鼠標右鍵，然后單擊快捷菜單中的 “字體”。在 “字體” 選項卡中，從 “字體”、“字型”、“大小” 和 “顏色” 框中，選擇選項來設(shè)置文本格式；也可以在 “效果” 下選擇一個或多個選項。在 “預覽” 區(qū)域中，將顯示文本在應用設(shè)置值之后的效果。 3）插入特殊字符 在網(wǎng)頁視圖模式下，將光標放在要插入字符的位置。在 “插入” 菜單中，單擊 “符號”；選擇插入字符單擊 “插入”，然后單擊 “關(guān)閉”。 4)在文本周圍添加邊框 可以在文本周圍添加邊框，然后設(shè)置其屬性，例如邊框的樣式、顏色、邊距和寬度。 當添加邊框時，它會被應用到整個段落。 在網(wǎng)頁視圖模式

11、下，選擇要添加邊框的段落。單擊主菜單“格式/邊框與陰影” 命令，彈出其對話框： 若想要四邊邊框，在 “設(shè)置” 下單擊 “方框”。要設(shè)置邊框的屬性，單擊 “樣式、顏色和寬度” 中的選項。 若要創(chuàng)建自定義邊框，在 “設(shè)置” 下單擊 “自定義”。自定義邊框可以在特定邊具有邊框，而且每邊可以有不同的樣式、顏色和寬度。 要指定邊距（文本和其邊框間的距離），在 “填充” 下的 “上”、“下”、“左” 和 “右” 框中，輸入磅數(shù)值。 5）給文本添加底紋 可以給文本添加底紋，底紋（如同網(wǎng)頁背景）可以是顏色或圖片。當添加底紋時，它會被應用到整個段落上。 在網(wǎng)頁視圖模式下，選擇要添加底紋的段落。單擊菜單“格式/邊

12、框和陰影”命令，然后單擊 “陰影” 選項卡： 要為所選文本設(shè)置背景顏色，在 “背景顏色” 框中選擇顏色；要為所選文本設(shè)置顏色，在 “前景顏色” 框中選擇顏色；要為所選文本設(shè)置背景圖片，在 “背景圖片” 框中鍵入圖片的名稱和位置，或單擊 “瀏覽” 來查找和選擇圖片。 6）增加或減小字符間距 可以增加或減小字符間距來放松或緊縮文本。 在網(wǎng)頁視圖模式下選擇文本，單擊鼠標右鍵，然后單擊快捷菜單中的 “字體”。單擊 “字符間距” 選項卡：在 “間距” 框中，單擊 “擴充” 或 “緊縮” 來更改文本的間距；在 “間距大小” 框中，選擇所需的文本間距選項。 7）設(shè)置行和段落的縮進（換行快捷鍵Shift +

13、Enter ） 可以指定所要的段落縮進方式。例如可以縮進段落的右邊或左邊，或只縮進第一行。 在網(wǎng)頁視圖模式下，選擇一個或多個段落，單擊鼠標右鍵，然后單擊快捷菜單中的 “段落”。 在其對話框的“縮進” 中：要縮進段落的左邊，在 “文本之前” 框中輸入磅數(shù)；要縮進段落的右邊，在 “文本之后” 框中輸入磅數(shù)；要縮進段落中文本的第一行，在 “首行縮進” 框中輸入磅數(shù)。 8）設(shè)置行距和段落間距 操作步驟：在網(wǎng)頁視圖模式下，選擇一個或多個段落，單擊鼠標右鍵，然后單擊快捷菜單中的 “段落”。 在 “段落間距” 中，設(shè)置文本的段落間距：設(shè)置每個段落之上的間距，在 “段前” 框中輸入一個值；設(shè)置每個段落之下的間

14、距，在 “段后” 框中輸入一個值；設(shè)置每行文本間的垂直間距，單擊 “行距大小” 框中選項；設(shè)置字間距，請在 “單字間距” 框中輸入一個值。五、超鏈接 超鏈接是從一個網(wǎng)頁指向另一個目的端的鏈接，例如指向另一個網(wǎng)頁或者相同網(wǎng)頁上的不同位置。這個目的端通常是另一個網(wǎng)頁，但它也可以是一幅圖片、一個電子郵件地址、一個文件或者一個程序。超鏈接可以是文本或者圖片。 當創(chuàng)建一個超鏈接時，它的目的端將被編碼為 URL （統(tǒng)一資源定位符），例如 http:/ 或 file:/ComputerName/SharedFolder/FileName.htm 。 URL 包含了站點服務(wù)器或者網(wǎng)絡(luò)位置、路徑和文件。 1、創(chuàng)

15、建指向一個站點中的網(wǎng)頁或文件的超鏈接 可以創(chuàng)建指向一個目的端，如一個站點中的網(wǎng)頁或文件的超鏈接。當站點訪問者單擊該超鏈接時，該目的端將顯示在 Web 瀏覽器上。 操作步驟： 在網(wǎng)頁視圖模式下，鍵入要將其用作超鏈接的文本然后選中它。 單擊 “超鏈接”圖標 ，瀏覽目標網(wǎng)頁或文件所在的站點，然后選擇該網(wǎng)頁或文件。（快捷鍵 Ctrl + K ） 2、書簽超鏈接 1）創(chuàng)建一個書簽 書簽是網(wǎng)頁中被標記的位置或被標記的選中文本，可以將書簽用作超鏈接的目的端。 例如如果要向站點訪問者顯示網(wǎng)頁上某個部份，則可以添加一個以書簽為目的端的超鏈接；當站點訪問者單擊該超鏈接時，將顯示網(wǎng)頁的相關(guān)部分而不是網(wǎng)頁的上端。 如

16、果文本被標為書簽，文本就會以下底線顯示。 操作步驟：在網(wǎng)頁視圖模式下，將插入點定位在想要創(chuàng)建書簽的地方，或者選擇想要指定書簽的文本。單擊主菜單“插入/書簽”命令，在 “書簽名稱” 框中鍵入書簽的名稱 。 2）創(chuàng)建指向一個書簽的超鏈接 在網(wǎng)頁視圖模式下，鍵入要將其用作超鏈接的文本然后選中它。單擊 “超鏈接” ，選擇包含書簽的網(wǎng)頁。在 “書簽” 框上，單擊要將其作為目的端的書簽。 3、創(chuàng)建用來傳送電子郵件消息的超鏈接 可以創(chuàng)建一個超鏈接來打開和傳送電子郵件的消息到所指定的位置。 在網(wǎng)頁視圖模式下，鍵入要將其用作超鏈接的文本，然后選中它。單擊 “超鏈接” 按鈕，單擊 “制作發(fā)送電子郵件的超鏈接” 按

17、鈕，鍵入要將消息送至的電子郵件地址。 4、設(shè)置超鏈接顏色 可以選擇 Web 瀏覽器用來顯示超鏈接的顏色，通常選擇三種顏色來用于超鏈接的不同狀態(tài)： 超鏈接 即未被選中的超鏈接。 當前超鏈接 即當前被選中的超鏈接。 已訪問過的超鏈接 即已經(jīng)被瀏覽過的超鏈接。 操作步驟：在網(wǎng)頁視圖模式下，右鍵單擊網(wǎng)頁，再單擊快捷菜單中的 “網(wǎng)頁屬性”，然后單擊 “背景” 選項卡。 在 “超鏈接”、“已訪問過的超鏈接” 以及 “當前超鏈接” 框中，選擇想要的顏色。 5、向超鏈接添加字體效果 可以向超鏈接添加字體效果，這樣當站點訪問者將鼠標懸停在超鏈接上，字體可以更改。例如可以設(shè)置超鏈接將字體更改為較大的、加粗和紅色的字體，移動鼠標指針經(jīng)過時能出現(xiàn)這種字體效果。 操作步驟： 在網(wǎng)頁視圖模式下，右鍵單擊網(wǎng)頁，再單擊快捷菜單中的 “網(wǎng)頁屬性”，然后單擊 “背景” 選項卡。 選擇 “啟用超鏈接翻轉(zhuǎn)效果” 復選框。 單擊 “翻轉(zhuǎn)樣式”。 為當前網(wǎng)頁上的超鏈接設(shè)置字體屬性。 6、刪除一個超鏈接 在網(wǎng)頁視圖模式下，選擇