項(xiàng)目4-網(wǎng)頁處理-課件_第1頁
項(xiàng)目4-網(wǎng)頁處理-課件_第2頁
項(xiàng)目4-網(wǎng)頁處理-課件_第3頁
項(xiàng)目4-網(wǎng)頁處理-課件_第4頁
項(xiàng)目4-網(wǎng)頁處理-課件_第5頁
已閱讀5頁,還剩93頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

《計(jì)算機(jī)應(yīng)用基礎(chǔ)》

項(xiàng)目4網(wǎng)頁處理

7/22/20231南京化工職業(yè)技術(shù)學(xué)院信息系回顧及作業(yè)點(diǎn)評

上次任務(wù)是利用所掌握的數(shù)據(jù)處理知識,制作學(xué)生會考成績匯總表點(diǎn)評學(xué)生提交的作業(yè)7/22/20232南京化工職業(yè)技術(shù)學(xué)院信息系任務(wù)的引入大家平時見到網(wǎng)上豐富多彩的網(wǎng)頁是否心動過,我可以做嗎?本項(xiàng)目就可以完成大家的心愿。7/22/20233南京化工職業(yè)技術(shù)學(xué)院信息系本單元任務(wù)引導(dǎo)訓(xùn)練——創(chuàng)建個人網(wǎng)站任務(wù)1:創(chuàng)建個人網(wǎng)站站點(diǎn)任務(wù)2:創(chuàng)建個人網(wǎng)站頁面回顧訓(xùn)練——班級網(wǎng)站的制作拓展訓(xùn)練——大學(xué)生生活網(wǎng)站的制作實(shí)訓(xùn)練習(xí)——公司網(wǎng)站的制作7/22/20234南京化工職業(yè)技術(shù)學(xué)院信息系能力目標(biāo)

通過MicrosoftFrontPage2019的學(xué)習(xí),能夠根據(jù)需求進(jìn)行個人站點(diǎn)和個人網(wǎng)頁網(wǎng)頁的設(shè)計(jì)、制作、發(fā)布及管理。7/22/20235南京化工職業(yè)技術(shù)學(xué)院信息系知識目標(biāo)

1、掌握MicrosoftFrontPage2019基本操作;2、掌握FrontPage2019中表格操作、文本編輯、圖像操作;3、掌握文本、圖像、熱點(diǎn)超鏈接,書簽超鏈接;4、掌握框架網(wǎng)頁的操作;5、掌握表單及設(shè)置表單屬性。7/22/20236南京化工職業(yè)技術(shù)學(xué)院信息系

MicrosoftFrontPage2019是微軟公司推出的一款網(wǎng)頁設(shè)計(jì)、制作、發(fā)布、管理的軟件。由于其集成了編輯、代碼、預(yù)覽和所見即所得特性,既具備良好的表格控制能力,又能與MicrosoftOffice各軟件實(shí)現(xiàn)無縫連接,被認(rèn)為是網(wǎng)頁初學(xué)者的優(yōu)秀應(yīng)用工具之一。7/22/20237南京化工職業(yè)技術(shù)學(xué)院信息系引導(dǎo)訓(xùn)練4.1—創(chuàng)建個人網(wǎng)站站點(diǎn)7/22/20238南京化工職業(yè)技術(shù)學(xué)院信息系任務(wù)描述

個人網(wǎng)站是展示自己的一個很好的平臺,內(nèi)容包括個人基本情況、求學(xué)經(jīng)歷、工作實(shí)踐經(jīng)歷、所獲獎勵、簡介等。本任務(wù)主要利用FrontPage2019實(shí)現(xiàn)個人網(wǎng)站的建立與頁面內(nèi)容的編輯管理。本任務(wù)通過對個人網(wǎng)站站點(diǎn)的建立、首頁內(nèi)容的編輯,了解FrontPage2019的啟動與退出,熟悉FrontPage2019的操作界面,掌握新建站點(diǎn)、表格操作、文本編輯、圖像操作等。7/22/20239南京化工職業(yè)技術(shù)學(xué)院信息系技術(shù)要點(diǎn)1、FrontPage2019的操作;2、FrontPage2019站點(diǎn)的建立;3、文字與圖像的編輯處理4、組件的使用5、框架網(wǎng)頁6、頁面保存7/22/202310南京化工職業(yè)技術(shù)學(xué)院信息系分別按以下兩種方法啟動FrontPage

1)從“開始”菜單啟動。單擊“開始|程序|MicrosoftOffice/FrontPage2019”命令。

2)利用桌面快捷圖標(biāo)啟動。在桌面上創(chuàng)建FrontPage2019快捷圖標(biāo),雙擊此快捷圖標(biāo)即可。操作演示1、啟動FrontPage

7/22/202311南京化工職業(yè)技術(shù)學(xué)院信息系

打開FrontPage時選右側(cè)欄的“新建網(wǎng)站”。也可在“常用”工具欄中“新建普通網(wǎng)頁”按鈕的下拉菜單中選擇“站點(diǎn)”。如圖4-1所示:2、新建站點(diǎn)

操作演示7/22/202312南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-1新建一個網(wǎng)頁的網(wǎng)站操作演示2、新建站點(diǎn)7/22/202313南京化工職業(yè)技術(shù)學(xué)院信息系示例:在D盤新建“個人網(wǎng)站”站點(diǎn)。1)打開D盤,新建“個人網(wǎng)站”文件夾。2)回到FrontPage2019的操作界面,單擊“文件|新建”菜單命令,在窗口的右方彈出“新建”任務(wù)窗格。3)在“新建”任務(wù)窗格中的“新建網(wǎng)站”選項(xiàng)內(nèi)選擇“由一個網(wǎng)頁組成的網(wǎng)站”,彈出“網(wǎng)站模板”對話框,如圖4-2所示。

操作演示2、新建站點(diǎn)7/22/202314南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-2網(wǎng)站模板

2、新建站點(diǎn)操作演示7/22/202315南京化工職業(yè)技術(shù)學(xué)院信息系4)在“常規(guī)”選項(xiàng)卡中選項(xiàng)“只有一個網(wǎng)頁的網(wǎng)站”,在“指定新網(wǎng)站的位置”文本框中輸入網(wǎng)站的地址:“D:\個人網(wǎng)站\web”。5)單擊“確定”按鈕,新建站點(diǎn)如圖4-3所示。

2、新建站點(diǎn)操作演示7/22/202316南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-3新建站點(diǎn)

2、新建站點(diǎn)操作演示7/22/202317南京化工職業(yè)技術(shù)學(xué)院信息系在新建站點(diǎn)文件夾列表中,有系統(tǒng)自動建立的“_private”和“images”兩個文件夾?!癷mages”文件夾中可以存放用戶編輯站點(diǎn)時用到的圖片“_private”文件夾對于瀏覽者來說是隱藏的,用戶可以把一些不想讓瀏覽者看到的網(wǎng)頁文件放在這個文件夾里。另外,“index.htm”是用戶在新建只包含一個網(wǎng)頁的站點(diǎn)時,frontPage2019自動為用戶創(chuàng)建的站點(diǎn)主頁。7/22/202318南京化工職業(yè)技術(shù)學(xué)院信息系打開網(wǎng)頁的方法:1)單擊“文件|打開”菜單命令,彈出“打開文件”對話框,index.htm,單擊“打開”按鈕。2)文件夾視圖下,雙擊index.htm3)文件夾視圖下,右擊index.htm,在快捷菜單中選擇“打開”命令。3、打開網(wǎng)頁

操作演示7/22/202319南京化工職業(yè)技術(shù)學(xué)院信息系1)網(wǎng)頁標(biāo)題的設(shè)置FrontPage中,網(wǎng)頁標(biāo)題不同于頁面的標(biāo)題,網(wǎng)頁標(biāo)題不在頁面內(nèi)顯示,在標(biāo)題欄顯示。設(shè)置網(wǎng)頁標(biāo)題是在網(wǎng)頁屬性中,如圖4-4所示,其中“個人介紹”就是網(wǎng)頁的標(biāo)題。4、頁面編輯和處理

操作演示7/22/202320南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-4網(wǎng)頁屬性

操作演示7/22/202321南京化工職業(yè)技術(shù)學(xué)院信息系2)表格操作示例:在主頁面插入一個五行一列的表格,具體要求:(1)插入表格(2)設(shè)置表格屬性(3)設(shè)置單元格屬性(4)嵌套一個1行2列的表格(5)嵌套一個2行9列的表格(6)合并單元格(7)單元格背景設(shè)置

操作演示4、頁面編輯和處理

7/22/202322南京化工職業(yè)技術(shù)學(xué)院信息系(1)插入表格

插入表格有3種方法可供選擇:單擊“常用”工具欄中的“插入表格”按鈕,在打開的表格示意框中拖動鼠標(biāo)選擇5行1列的表格。單擊“表格|插入|表格”菜單命令,彈出“插入表格”的對話框,在“大小”選區(qū)中選5行1列單擊“表格|繪制表格”菜單命令,打開“表格”工具欄;單擊“繪制表格”的按鈕,當(dāng)光標(biāo)變?yōu)楣P的形狀時,繪制5行1列的表格。操作演示7/22/202323南京化工職業(yè)技術(shù)學(xué)院信息系(2)設(shè)置表格屬性

要求:指定寬度為100%,邊框粗細(xì)為0,其他項(xiàng)為默認(rèn)值。方法如下:光標(biāo)定位在表格中任意位置;單擊鼠標(biāo)右鍵,在快捷菜單中選擇“表格屬性”命令,彈出“表格屬性”的對話框;指定寬度選擇“百分比”,文本框內(nèi)輸入100;邊框粗細(xì)選擇為0;單擊“確定”按鈕即可。操作演示7/22/202324南京化工職業(yè)技術(shù)學(xué)院信息系(3)設(shè)置單元格屬性

要求:第二行單元格背景設(shè)置為“紫紅色”;第三行單元格背景設(shè)置為“銀白色”。方法如下:選中第二行單元格;單擊鼠標(biāo)右鍵,在快捷菜單中選擇“單元格屬性”命令,在“背景”“顏色”選框內(nèi)選擇“紫紅色”;同樣方法設(shè)置第三行單元格背景。操作演示7/22/202325南京化工職業(yè)技術(shù)學(xué)院信息系(4)嵌套一個1行2列的表格

要求:在第一行嵌套一個1行2列的表格,表格屬性設(shè)置為:指定寬度60%,指定高度100%,邊框粗細(xì)為0。方法如下:光標(biāo)定位第1行;單擊“表格|插入|表格”菜單命令,彈出“插入表格”對話框;在“大小”選區(qū)中選擇1行2列;指定寬度選擇“百分比”,文本框內(nèi)輸入60;指定高度選擇“百分比”,文本框內(nèi)輸入100;邊框粗細(xì)選擇0;單擊“確定”按鈕即可。操作演示7/22/202326南京化工職業(yè)技術(shù)學(xué)院信息系(5)嵌套一個2行9列的表格

要求①:在第4行嵌套一個2行9列的表格,設(shè)置表格屬性為:指定寬度100%,指定高度100%,邊框粗細(xì)為0。(方法參照第(4)步)

要求②:合并單元格:分別合并2行9列表格中的2、4、6、8列的單元格。操作如下:選中2行9列表格中的第2列單元格,選擇以下三種方法之一進(jìn)行操作:單擊右鍵,在快捷菜單中選擇“合并單元格”命令。選擇“表格|合并單元格”菜單命令。單擊“表格”工具欄中的“合并單元格”按鈕。操作演示7/22/202327南京化工職業(yè)技術(shù)學(xué)院信息系對齊方式:在系統(tǒng)默認(rèn)的情況下,表格在網(wǎng)頁上是左對齊的,通過設(shè)置“對齊方式”改變這種對齊方式。浮動:在默認(rèn)情況下表格周圍是不能排列文字的,為了讓文本與表格融為一體,可以使用表格的浮動對齊。7/22/202328南京化工職業(yè)技術(shù)學(xué)院信息系3)設(shè)置單元格屬性表格的單元格可以放置文字、圖片、以及表格(表格嵌套)等內(nèi)容。通過設(shè)置單元格的格式,可以使表格中的某些單元格的對齊方式、邊框、背景色等屬性與表格中的其他單元格屬性不同。選中需要編輯的表格,選擇“表格”菜單中的“單元格”命令,出現(xiàn)“單元格屬性”對話框,如圖4-5所示。根據(jù)需要進(jìn)行相應(yīng)的修改即可。

4、頁面編輯和處理

操作演示7/22/202329南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-5設(shè)置單元格屬性操作演示4、頁面編輯和處理

7/22/202330南京化工職業(yè)技術(shù)學(xué)院信息系表格中文本的對齊方式一般通過設(shè)置“單元格屬性”中的對齊方式來實(shí)現(xiàn)。鼠標(biāo)定位在需要設(shè)置文本格式的單元格中,單擊鼠標(biāo)右鍵,在快捷菜單中選擇“單元格屬性”,在對話框“布局”一欄中,選擇合適的“水平對齊方式”與“垂直對齊方式”段落分段按“Enter”鍵,換行而不另起段落則需插入換行符,或按“Shift+Enter”組合鍵實(shí)現(xiàn)。7/22/202331南京化工職業(yè)技術(shù)學(xué)院信息系4)文本編輯輸入文本內(nèi)容,設(shè)置文本格式。在相應(yīng)的單元格中輸入文本內(nèi)容,并按文本框中的要求對文本進(jìn)行字體和段落格式設(shè)置。在FrontPage中,文本編輯的操作方法與Word基本相同。如圖4-6所示:

4、頁面編輯和處理

操作演示7/22/202332南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-6主頁表格

操作演示7/22/202333南京化工職業(yè)技術(shù)學(xué)院信息系5)水平線的設(shè)置。①插入:單擊“插入|水平線”菜單命令,在兩行文本之間出現(xiàn)一條系統(tǒng)默認(rèn)的水平線;②屬性設(shè)置:選中水平線,單擊鼠標(biāo)右鍵,在快捷才當(dāng)中選擇“水平線屬性”命令;或者雙擊水平線,彈出“水平線屬性”對話框。如圖4-7所示。

操作演示4、頁面編輯和處理

7/22/202334南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-7“水平線屬性”對話框

操作演示7/22/202335南京化工職業(yè)技術(shù)學(xué)院信息系5)網(wǎng)頁的超鏈接超鏈接是指站點(diǎn)內(nèi)不同網(wǎng)頁之間或者站點(diǎn)與站點(diǎn)之間的鏈接關(guān)系。鏈接的目標(biāo)可以是頁面、圖像、電子郵件地址和音頻文件等。“插入超鏈接”對話框,如圖4-8所示:

操作演示4、頁面編輯和處理

7/22/202336南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-8創(chuàng)建文本超鏈接操作演示7/22/202337南京化工職業(yè)技術(shù)學(xué)院信息系

當(dāng)瀏覽者訪問一個網(wǎng)頁的時候,會面對三種不同的超鏈接:第一種是未訪問的鏈接;第二種是當(dāng)前正在的鏈接;第三種是已經(jīng)訪問過的鏈接??梢栽诰W(wǎng)頁屬性中為這三種不同的超鏈接文字設(shè)置不同的顏色。相關(guān)操作如圖4-9所示。7/22/202338南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-9設(shè)置超鏈接的顏色

操作演示7/22/202339南京化工職業(yè)技術(shù)學(xué)院信息系1)使用字幕在菜單【插入】中選擇【web組件】命令,在彈出的窗口中單擊“動態(tài)效果”—“字幕”選項(xiàng),字幕屬性如圖4-11所示。

5、動態(tài)效果的使用

操作演示7/22/202340南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-11創(chuàng)建字幕

操作演示7/22/202341南京化工職業(yè)技術(shù)學(xué)院信息系對字幕的文字(字符串)外觀進(jìn)行設(shè)置和對普通文字(字符串)的設(shè)置是一樣的。只不過字幕文字(字符串)是一個整體罷了。

7/22/202342南京化工職業(yè)技術(shù)學(xué)院信息系2)站點(diǎn)計(jì)數(shù)器在菜單【插入】中選擇【web組件】命令,在彈出的窗口中單擊計(jì)數(shù)器”選項(xiàng),字幕屬性如圖4-13所示。

5、動態(tài)效果的使用

操作演示7/22/202343南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-13插入計(jì)數(shù)器

操作演示7/22/202344南京化工職業(yè)技術(shù)學(xué)院信息系只有將站點(diǎn)內(nèi)容發(fā)布到Web服務(wù)器,并設(shè)置了網(wǎng)站的FrontPage服務(wù)器擴(kuò)展后,計(jì)數(shù)器才能正常顯示。7/22/202345南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-15組件效果

操作演示7/22/202346南京化工職業(yè)技術(shù)學(xué)院信息系3)網(wǎng)頁過渡效果在菜單【格式】中選擇【網(wǎng)頁過渡】命令,根據(jù)需要選擇合適的過渡效果,如圖4-16所示。

5、動態(tài)效果的使用

操作演示7/22/202347南京化工職業(yè)技術(shù)學(xué)院信息系

圖4-16網(wǎng)頁過渡

操作演示7/22/202348南京化工職業(yè)技術(shù)學(xué)院信息系3)網(wǎng)頁過渡效果示例:以設(shè)置觸發(fā)效果的事件為例,進(jìn)入和退出站點(diǎn)事件分別在瀏覽者通過設(shè)置效果的網(wǎng)頁進(jìn)入和退出用戶站點(diǎn)時發(fā)生。操作如下:在圖4-16中選擇“進(jìn)入網(wǎng)頁”事件,選擇“盒狀收縮”效果,再選擇“離開網(wǎng)頁”事件,選擇“原型放射”效果,單擊“確定”按鈕。選擇【文件】菜單中的選擇【在瀏覽器中預(yù)覽】命令,單擊“確定”按鈕,即可看到設(shè)置效果。5、動態(tài)效果的使用

操作演示7/22/202349南京化工職業(yè)技術(shù)學(xué)院信息系1)框架保存在菜單【文件】中選擇【另存為】按鈕,在對話框中整個框架示意圖的邊框?yàn)樗{(lán)色。2)關(guān)閉網(wǎng)頁單擊網(wǎng)頁窗口右上角的“關(guān)閉”按鈕,即可關(guān)閉網(wǎng)頁。3)退出單擊應(yīng)用程序窗口右上角的“關(guān)閉”按鈕,即可退出。

6、保存、關(guān)閉與退出

操作演示7/22/202350南京化工職業(yè)技術(shù)學(xué)院信息系1)打開FrontPage。單擊“開始”—“程序”—“MicrosoftOffice”—“MicrosoftOfficeFrontPage2019”2)認(rèn)識FrontPage窗口。如圖4-20所示:1、FrontPage2019啟動與界面

知識拓展7/22/202351南京化工職業(yè)技術(shù)學(xué)院信息系標(biāo)題欄菜單欄常用工具欄格式工具欄狀態(tài)欄視圖欄編輯窗口圖4-20FrontPage窗口7/22/202352南京化工職業(yè)技術(shù)學(xué)院信息系2)站點(diǎn)的打開、關(guān)閉與刪除①打開站點(diǎn)單擊“文件|打開網(wǎng)站”菜單命令,在彈出的“打開網(wǎng)站”對話框中選擇要打開的網(wǎng)站,單擊“打開”按鈕即可打開站點(diǎn)。單擊“常用”工具欄上的打開按鈕“”,在彈出的“打開”對話框中選擇要打開的網(wǎng)站,單擊“打開”按鈕即可打開站點(diǎn)。

知識拓展7/22/202353南京化工職業(yè)技術(shù)學(xué)院信息系2)站點(diǎn)的打開、關(guān)閉與刪除②關(guān)閉站點(diǎn)。單擊“文件|關(guān)閉網(wǎng)站”菜單命令即可關(guān)閉當(dāng)前站點(diǎn)。③刪除站點(diǎn)在“文件夾列表”中選中要刪除的站點(diǎn),單擊“編輯|刪除”菜單,在彈出的“確認(rèn)刪除”對話框中按需要選擇,單擊“確定”按鈕即可。在“文件夾列表”中選中要刪除的站點(diǎn),單擊鼠標(biāo)右鍵,選擇快捷菜單中的“刪除”命令,在彈出的“確認(rèn)刪除”對話框中按需要選擇,單擊“確定”按鈕即可。

知識拓展7/22/202354南京化工職業(yè)技術(shù)學(xué)院信息系3)認(rèn)識FrontPage的視圖方式①編輯模式切換按鈕FrontPage2019具備“設(shè)計(jì)”、“拆分”、“代碼”、“預(yù)覽”四種編輯模式,如圖4-21所示。②FrontPage2019的視圖

FrontPage共有7種視圖:網(wǎng)頁視圖,文件夾視圖,遠(yuǎn)程網(wǎng)站視圖,報(bào)表視圖,導(dǎo)航視圖,超鏈接視圖,任務(wù)視圖,如圖4-22所示。

知識拓展7/22/202355南京化工職業(yè)技術(shù)學(xué)院信息系圖4-21四種模式編輯模式7/22/202356南京化工職業(yè)技術(shù)學(xué)院信息系圖4-22七種視圖視圖模式7/22/202357南京化工職業(yè)技術(shù)學(xué)院信息系網(wǎng)頁視圖:人們最常用的視圖,在這里進(jìn)行網(wǎng)頁編輯文件夾視圖:對站點(diǎn)中的文件夾進(jìn)行各種操作遠(yuǎn)程網(wǎng)站視圖:幫助用戶將整個網(wǎng)站和單獨(dú)的文件、文件夾發(fā)布到任何位置。報(bào)表視圖:通過“報(bào)表”視圖,可以在運(yùn)行報(bào)表查詢后分析網(wǎng)站內(nèi)容

知識拓展7/22/202358南京化工職業(yè)技術(shù)學(xué)院信息系導(dǎo)航視圖:該視圖提供了網(wǎng)頁的分層視圖,通過此視圖,可以調(diào)整網(wǎng)頁在網(wǎng)站中的位置超鏈接視圖:“超鏈接”視圖可以將網(wǎng)站中超鏈接的狀態(tài)顯示在一個列表中任務(wù)視圖:“任務(wù)”視圖用以站內(nèi)制作工作的進(jìn)展?fàn)顩r的備忘

知識拓展7/22/202359南京化工職業(yè)技術(shù)學(xué)院信息系4)在網(wǎng)站中添加和刪除網(wǎng)頁①添加網(wǎng)頁選擇“文件”“打開站點(diǎn)”,打開已有的網(wǎng)頁文件夾。選擇“文件”“新建”

命令,出現(xiàn)“新建網(wǎng)頁”對話框,選中“其他網(wǎng)頁模式”,如圖4-23所示。

知識拓展7/22/202360南京化工職業(yè)技術(shù)學(xué)院信息系圖4-23新建網(wǎng)頁7/22/202361南京化工職業(yè)技術(shù)學(xué)院信息系②刪除網(wǎng)頁打開已有站點(diǎn)的網(wǎng)頁文件夾。單擊視圖工具欄的“文件夾視圖”按鈕,顯示文件夾列表,選中要刪除的網(wǎng)頁,按需要刪除相應(yīng)網(wǎng)頁。

知識拓展7/22/202362南京化工職業(yè)技術(shù)學(xué)院信息系5)文本格式的設(shè)置6)段落格式的設(shè)置7)項(xiàng)目符號和編號列表的設(shè)置8)表格的操作以上操作方法均與Word相同的。

知識拓展7/22/202363南京化工職業(yè)技術(shù)學(xué)院信息系9)插入與編輯圖像、對象網(wǎng)頁制作時常用GIF和JPEG這兩種圖像格式的文件。GIF格式的圖像顯示的顏色數(shù)目較少,僅支持256色,具有較高的下載速度且具有動態(tài)的效果。JPEG格式主要用于顯示需要有逼真圖形效果的圖像。

知識拓展7/22/202364南京化工職業(yè)技術(shù)學(xué)院信息系①網(wǎng)頁圖像背景的設(shè)置“格式”“背景”,打開“網(wǎng)頁屬性”對話框,在“格式”項(xiàng)目中選中“背景圖片”,為網(wǎng)頁選擇一幅圖片作為背景。

知識拓展7/22/202365南京化工職業(yè)技術(shù)學(xué)院信息系②插入圖片對象插入的圖片對象可以是圖片文件和剪貼畫。插入圖片后,可以對圖片屬性進(jìn)行設(shè)置。方法:選中插入的圖片,選擇“格式”菜單中的“屬性”命令,根據(jù)出現(xiàn)的對話框進(jìn)行相應(yīng)的操作。

知識拓展7/22/202366南京化工職業(yè)技術(shù)學(xué)院信息系③插入視頻圖像插入的視頻文件有3種格式:AVI視頻文件;MPEG視頻文件:以.mpg為擴(kuò)展名。QuickTime視頻文件:以.mov為擴(kuò)展名。

知識拓展7/22/202367南京化工職業(yè)技術(shù)學(xué)院信息系④插入音頻文件網(wǎng)頁中常用的音頻文件格式:.WAV、.MIDI、.RMI、.RA和.AU等。

知識拓展7/22/202368南京化工職業(yè)技術(shù)學(xué)院信息系⑤插入特殊對象插入符號

將光標(biāo)移動到插入點(diǎn),選擇“插入”“符號”菜單,彈出“符號”對話框插入水平線把光標(biāo)移動到插入水平線的位置,選擇“插入”“水平線”菜單。

知識拓展7/22/202369南京化工職業(yè)技術(shù)學(xué)院信息系⑤插入特殊對象插入時間標(biāo)記在頁面末尾輸入:“更新時間”,選擇“插入”“日期與時間”命令,在“日期時間屬性”對話框中選擇“該網(wǎng)頁上次編輯日期”。插入注釋選擇“插入”“注釋”命令。

知識拓展7/22/202370南京化工職業(yè)技術(shù)學(xué)院信息系10)其他常用Web組件懸停按鈕橫幅廣告管理器鏈接欄以上操作均選擇“插入”“Web組建”命令。交互式按鈕選擇“插入”“交互式按鈕”命令。知識拓展7/22/202371南京化工職業(yè)技術(shù)學(xué)院信息系單擊插入的懸停按鈕,拖動它周圍的小黑點(diǎn)我們就改變了它的大小。。設(shè)置橫幅廣告的寬度和高度值因該要與要添加的圖片大小一致。如果設(shè)置值比圖片小,圖片會被截掉一部分;如果設(shè)置值大,圖片周圍會以灰色填充。7/22/202372南京化工職業(yè)技術(shù)學(xué)院信息系11)其他超鏈接①書簽超鏈接

添加書簽:選中要插入書簽的文字,選擇“插入”“書簽”命令,書簽名稱就是選擇的文本名稱。建立到書簽的鏈接知識拓展7/22/202373南京化工職業(yè)技術(shù)學(xué)院信息系11)其他超鏈接②框架網(wǎng)頁超鏈接③圖像超鏈接④電子郵件超鏈接知識拓展7/22/202374南京化工職業(yè)技術(shù)學(xué)院信息系引導(dǎo)訓(xùn)練4.2—制作個人網(wǎng)站頁面7/22/202375南京化工職業(yè)技術(shù)學(xué)院信息系任務(wù)描述

網(wǎng)站的首頁制作出來以后,要創(chuàng)建和編輯各個分頁,且各網(wǎng)頁間要實(shí)現(xiàn)跳轉(zhuǎn)。本任務(wù)通過個人網(wǎng)站中網(wǎng)頁的新建與編輯,學(xué)習(xí)FrontPage2019中新建網(wǎng)頁、表單、超級鏈接和框架網(wǎng)頁的操作。7/22/202376南京化工職業(yè)技術(shù)學(xué)院信息系技術(shù)要點(diǎn)1、新建網(wǎng)頁2、插入表單及設(shè)置表單屬性3、框架網(wǎng)頁的操作4、文本、圖像處理5、熱點(diǎn)超鏈接,書簽超鏈接。7/22/202377南京化工職業(yè)技術(shù)學(xué)院信息系示例:新建一個以“inform.htm”命名的空白網(wǎng)頁有3種創(chuàng)建方式:在文件夾視圖下創(chuàng)建。單擊“常用”工具欄的新建按鈕右邊的下拉列表框,選擇“空白網(wǎng)頁”命令,創(chuàng)建一個空白網(wǎng)頁,重命名為“inform.htm”。單擊“文件|新建”菜單命令,選擇“空白網(wǎng)頁”,創(chuàng)建一個空白網(wǎng)頁,重命名為“inform.htm”。操作演示1、空白網(wǎng)頁的新建及編輯

7/22/202378南京化工職業(yè)技術(shù)學(xué)院信息系示例:編輯“inform.htm”網(wǎng)頁插入表格、文本設(shè)置網(wǎng)頁的背景,網(wǎng)頁背景圖片為back.gif,設(shè)置為水印電子郵件超鏈接,鏈接的電子郵件地址為webmaster126網(wǎng)頁效果:文本格式設(shè)置為“宋體”、“14磅”、“左對齊”、顏色為“Hex={CC,99,00}”

操作演示7/22/202379南京化工職業(yè)技術(shù)學(xué)院信息系

示例:按照上述方法新建introduction.htm、study.htm、aword.htm、practise.htm4個空白網(wǎng)頁。按要求進(jìn)行相應(yīng)的編輯。

操作演示7/22/202380南京化工職業(yè)技術(shù)學(xué)院信息系1)新建框架網(wǎng)頁FrontPage2019提供了10個框架網(wǎng)頁向?qū)?。操作步驟如下:打開【文件】【新建】菜單項(xiàng),在子菜單中選擇【網(wǎng)頁】菜單項(xiàng),出現(xiàn)新建對話框。在對話框中單擊【框架網(wǎng)頁】選項(xiàng)卡按需求選擇相應(yīng)的框架網(wǎng)頁。操作演示2、框架網(wǎng)頁的新建、屬性設(shè)置、編輯與保存

7/22/202381南京化工職業(yè)技術(shù)學(xué)院信息系1)新建框架網(wǎng)頁“新建網(wǎng)頁”:在當(dāng)前框架網(wǎng)頁中輸入文字、圖片等內(nèi)容“設(shè)置初始網(wǎng)頁”:為所在的框架超鏈接到指定的網(wǎng)頁上去操作演示

7/22/202382南京化工職業(yè)技術(shù)學(xué)院信息系2)框架網(wǎng)頁的屬性設(shè)置框架有很多屬性,如框架的名稱、寬度、高度、邊距、滾動條、可調(diào)整性、間距等。

設(shè)置框架屬性:選擇要設(shè)置屬性的框架,單擊【框架】菜單,再單擊【框架屬性】菜單項(xiàng),出現(xiàn)對話框??梢栽诖藢υ捒蛑行薷目蚣艿膶傩浴?蚣芫W(wǎng)頁的屬性:在【框架屬性】對話框中,單擊【框架網(wǎng)頁】按鈕,會出現(xiàn)“網(wǎng)頁屬性”對話框。

操作演示7/22/202383南京化工職業(yè)技術(shù)學(xué)院信息系3)框架網(wǎng)頁的編輯示例:

“設(shè)置初始網(wǎng)頁”和“新建網(wǎng)頁”的編輯單擊“新建網(wǎng)頁”按鈕,在顯示的空白網(wǎng)頁中進(jìn)行編輯。在“header”框架中,“設(shè)置初始網(wǎng)頁”為“top.htm”網(wǎng)頁;在“main”框架中,“設(shè)置初始網(wǎng)頁”為“inform.htm”網(wǎng)頁。操作演示7/22/202384南京化工職業(yè)技術(shù)學(xué)院信息系4)保存網(wǎng)頁單擊“文件”“另存為”菜單命令;單擊“更改標(biāo)題”按鈕,在彈出的“輸入文字”對話框中輸入網(wǎng)頁標(biāo)題“個人介紹”;在“文件名”框中重命名框架文件為“index.htm”;單擊“保存”按鈕。操作演示7/22/202385南京化工職業(yè)技術(shù)學(xué)院信息系

保存框架網(wǎng)頁時,在“另存為”對話框中,右側(cè)框架網(wǎng)頁的預(yù)覽圖高亮顯示的框架,表示正在保存框架網(wǎng)頁。7/22/202386南京化工職業(yè)技術(shù)學(xué)院信息系1)設(shè)置框架網(wǎng)頁內(nèi)部的超鏈接

要求:當(dāng)鼠標(biāo)左鍵點(diǎn)擊超鏈接對象時,網(wǎng)頁中某一框架中的內(nèi)容也會隨之改變。示例:當(dāng)單擊文本“學(xué)習(xí)經(jīng)歷”時,下方框架中顯示網(wǎng)頁“study.htm”。

操作方法:①選中“學(xué)習(xí)經(jīng)歷”,單擊鼠標(biāo)右鍵,選擇“超鏈接”“插入超鏈接”“原有文件或網(wǎng)頁”“當(dāng)前文件夾”選中“study.htm”;②單擊對話框右側(cè)“目標(biāo)框架”按鈕,“目標(biāo)框架”“當(dāng)前框架”“下方框架”“目標(biāo)設(shè)置”“main”“確定”“確定”。操作演示3、插入超鏈接

7/22/202387南京化工職業(yè)技術(shù)學(xué)院信息系2)創(chuàng)建到電子郵箱的超鏈接

要求:在主頁中或其他網(wǎng)頁中,可以創(chuàng)建與網(wǎng)站電子郵箱的超鏈接。示例:在主頁下框架“與我聯(lián)系”文本能“超鏈接”到aster126”,郵箱地址;操作方法:①選中“與我聯(lián)系”單擊鼠標(biāo)右鍵選擇“超鏈接”“插入超鏈接”“電子郵件地址”文本欄輸入“webmaster126”操作演示7/22/202388南京化工職業(yè)技術(shù)學(xué)院信息系3)圖片超鏈接,鏈接到外部網(wǎng)頁

要求:單擊網(wǎng)頁中某一圖片,能鏈接到外部網(wǎng)頁。示例:單擊introduction.htm網(wǎng)頁內(nèi)的圖片能鏈接到南京化工職業(yè)技術(shù)學(xué)院主頁;操作方法:單擊鼠標(biāo)右鍵選擇“超鏈接”彈出“插入超鏈接”對話框選中左欄中的“原有文件或網(wǎng)頁”地址欄輸入“”操作演示7/22/202389南京化工職業(yè)技術(shù)學(xué)院信息系要求:將制作完的網(wǎng)站發(fā)布到因特網(wǎng)上。操作方法:①單擊“文件|發(fā)布網(wǎng)站”“遠(yuǎn)程網(wǎng)站屬性”對話框;②“遠(yuǎn)程Web服務(wù)器類型”“文件系統(tǒng)”。③在“遠(yuǎn)程網(wǎng)站位置”中輸入一個本地電腦中的文件夾“個人網(wǎng)站\web”網(wǎng)站。④單擊“確定”按鈕,系統(tǒng)提示“用戶是否希望在此位置創(chuàng)建網(wǎng)站”,單擊“是”按鈕。此時,系統(tǒng)自動切換到遠(yuǎn)程網(wǎng)站視圖中,單擊“

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論