【文章內(nèi)容簡介】 Frontpage2020 的操作界面（如圖 3）。 （圖 3） 對于初學(xué)者來說，一看到有那么多的菜單和那么多的按紐，不禁會嚇一大跳：“太復(fù)雜了，我看我還是不行了?！惫?，請你放心，你太抬舉 Frontpage2020 了，其實(shí)它沒什么，就那么一點(diǎn)， 你完全可以 “ 征服 ” 它的，給自己一點(diǎn)信心：） 22 我們來把 Frontpage2020 的界面劃分成兩半，你可以看見圖 3上面有一條紅線，當(dāng)然在你的 Frontpage2020 上面是沒有的，這只是筆者自己畫上去的，為了大家好區(qū)分。 好的，那么我們看圖 3，我們把紅線以上的那部分叫控制窗，紅線以下的叫制作窗。 控制窗包括常見的那些“文件，編輯”菜單，雖然看上去挺多挺復(fù)雜，但是它大部分常用的命令都?xì)w到了下面一欄的按紐欄中去了。你看，在流行圖形操作界面的今天，我們是多么地幸福?。海┫旅嬉粰跒閷傩詸冢覀兛梢杂眠@ 欄來定置文字和圖片的屬性等等。 制作窗包括編輯區(qū)和切換按紐。我們就把編輯區(qū)當(dāng)做是一張白紙吧，你可以在上面寫字（用鍵盤打字）和畫畫（插入圖片），具體操作我們將在下幾章學(xué)習(xí)。編輯區(qū)左下角有三個(gè)按紐，我們把它們叫做切換按紐：點(diǎn)“普通”按紐，就會出現(xiàn)默認(rèn)的編輯區(qū)。點(diǎn)“ HTML” 按紐，編輯區(qū)就會變成一個(gè)滿是英文（？?。┑拇翱?，我們可以在這里編輯 HTML，但是對于初學(xué)者，筆者不建議你去亂動。做好了網(wǎng)頁的時(shí)候，我們可以點(diǎn)一下 “ 預(yù)覽 ” 按紐來觀看自己做的網(wǎng)頁，不滿意可以再點(diǎn) “ 普通 ” 按紐回到編輯區(qū)修改。 23 另外當(dāng) 你第一次運(yùn)行 Frontpage2020 的時(shí)候，你會看到編輯區(qū)左邊會有另外的一欄，灰色的，上面有幾個(gè)按紐，它叫 “ 視圖 ” 欄。它可以讓你更方便地查看網(wǎng)頁的大小，連接等等。但是有時(shí)我們會覺得它妨礙了我們的工作，使編輯區(qū)看起來很窄很不舒服，為了不讓它妨礙我們工作，我們可以點(diǎn)擊控制窗菜單欄里的 “ 編輯 → 視圖 ” （如圖 4），使它消失， 要使用的時(shí)候再重復(fù)點(diǎn)擊一次使它出現(xiàn)，真方便：） （圖 4） 到此為止，我們就已經(jīng)和 Frontpage2020 交上朋友了，慢慢地，我們要進(jìn)一步控制它（真陰毒），讓它全心全意為我們服務(wù)。 課后反思： 一個(gè)新的軟件，學(xué)生們對它并不感到陌生，很快就接受了這個(gè)新朋友，因?yàn)樗彩?OFFICE 組件的一員，有共性。不難掌握。 24 第 十 課 時(shí) 練習(xí)課 [教學(xué)目標(biāo)： ] 使學(xué)生熟練掌握上節(jié)課所講內(nèi)容，認(rèn)識界面，新建保存站點(diǎn)。 [教學(xué)過程： ] 學(xué)生自行練習(xí)，每人先確定好自己的主題，并新建一站點(diǎn)。 遇到問題可相互討論或請教老師。 教師巡回指導(dǎo)。 課后反思：通過本節(jié)訓(xùn)練，學(xué)生 熟練掌握上節(jié)課所講內(nèi)容 ，能夠成功完成所布置的任務(wù)。少數(shù)要加強(qiáng)練習(xí)。 第 十 一 課時(shí)： 制作你的第一個(gè)主頁（ 1） [教學(xué)目標(biāo)： ] 使學(xué)生初步認(rèn)識 FRONTPAGE2020 的界面 [課時(shí)安排： ] 1 課時(shí)。 [教學(xué)重點(diǎn)： ] 25 1 修改文字的屬性時(shí)必須把需要修改的文字用鼠標(biāo)左鍵括起來。 2 網(wǎng)站內(nèi)所有文件都必須保存在網(wǎng)站文件夾內(nèi)。 3 已經(jīng)插入到網(wǎng)頁中的圖片不能再修改它的文件名。 [教學(xué)過程： ] 知道了一個(gè)網(wǎng)站的結(jié)構(gòu)之后，你是否很想馬上動手制作網(wǎng)站里面的網(wǎng)頁？那好，我們本章就來學(xué)習(xí)如何制作。 首先我們運(yùn)行 Frontpage2020，并且打開一個(gè)站點(diǎn)。在打開站點(diǎn)之后我們就要在制作窗的編輯區(qū)里 面開始工作了。 網(wǎng)頁就象一張白紙，該如何讓它顯得美觀，華麗，關(guān)鍵是要看網(wǎng)頁設(shè)計(jì)者自己。網(wǎng)頁中少不了文字和圖象，把文字和圖象擺在自己希望的位置，一個(gè)網(wǎng)頁就出來了。其實(shí)制作網(wǎng)頁就這么簡單，你也不想筆者浪費(fèi)口水了吧？那我們馬上開始。 我們新建一個(gè)網(wǎng)頁，你可以點(diǎn)擊控制窗按紐欄的來新建一個(gè)網(wǎng)頁。 網(wǎng)頁上的文字如何制作你該不會不知道吧？在編輯區(qū)打字，你打出來的文字就會出現(xiàn)在光標(biāo)閃動的地方（如圖 1）。我們在編輯區(qū)打上 “ 你好，歡迎你光臨我的主頁。 ” 26 （圖 1） （圖 2） （圖 3） 你可能不希望網(wǎng)頁上的文字都一樣，只是黑色的吧。你可能希望它是紅色，也可能希望它是藍(lán)色。又或者你希望某些文字比較大，而且還有一些特殊效果。如何才能做到更改文字？很簡單。我們用按住鼠標(biāo)的左鍵，把你想改變顏色的字括起來（如圖 2），括起來之后按鼠標(biāo)右鍵，選擇彈出菜單中的 “ 文字 ” （如圖 3）。接下來會彈出窗口中選擇你想要改變的方式（如圖 4）。 27 （圖 4） （圖 5） 字體菜單可選擇你希望的字體，字型可以改變文字的形狀，可以是粗體也可以是傾斜體，大小就是改變文字的大小，還可以改變顏色和增加一些文字的效果。更改好了可以在預(yù)覽區(qū)預(yù)覽一下，不滿意可以再改。 我們這樣來修改：把字體定置為宋體，在字體菜單中選擇宋 體。字型為粗體，在字型菜單中選粗體。文字大小為 6，即是 24 磅。顏色為紅色，文字效果為下劃線。按確定，你就會發(fā)現(xiàn)剛才打在編輯區(qū)的文字起了變化（如圖 5）。 當(dāng)然你也可以隨意更改成自己喜歡的樣式。 網(wǎng)頁中最主要的元素除了文字，就是圖片。如果網(wǎng)頁中只有文字，而沒有圖片的搭配或者裝飾，一定會顯的很呆板。那么在Frontpage2020 制作網(wǎng)頁中如何為網(wǎng)頁加上圖片呢？很簡單。 我們把編輯區(qū)上的鼠標(biāo)光標(biāo)移動到編輯區(qū)希望出現(xiàn)圖片的地方，然后按控制窗的按紐欄里面的插入圖片按紐，在彈出的窗口中選擇你希望放在網(wǎng) 頁上的圖片（如圖 6），按確定就行了。 大家記住，插入網(wǎng)頁中的圖片格式必須是“ JPG” 或者是“ GIF” 格式的，讀者如何區(qū)分這兩種格式呢與其他格式的不同 28 呢？如果你安裝了 ACDsee 這個(gè)著名的看圖軟件的話，你可以看一下圖 7 就能分清楚了。 （圖 6） （圖 7） 這里要提醒一下大家：在第二章已經(jīng)跟大家提過網(wǎng)站中圖片的保存位置了，大家必須把網(wǎng)頁中使用到的圖片保存在網(wǎng)站文件夾的“ images” 文件夾中。要是你插入的圖片不是保存在網(wǎng)站文件夾里的話，那你做好網(wǎng)頁瀏覽的時(shí)候就看不到網(wǎng)頁中你插入的圖片了。所以大家要緊記，網(wǎng)站中所有的文件，包括網(wǎng)頁，圖片等等都必須保存在這個(gè)網(wǎng)站的文件夾中，還必須用英文名字。 還要注意 的一點(diǎn)就是：已經(jīng)插入網(wǎng)頁中的圖片，你就不能再修改那張圖片的文件名了，否則在瀏覽時(shí)同樣會出現(xiàn)看不見圖片的后果。 筆者插入一張“ Wele” 字樣的圖片，如果你沒有的話可以插如其他自己喜歡的圖片。 29 到目前為止，一個(gè)簡單的網(wǎng)頁就算制作成功了，點(diǎn)擊制作窗的切換按紐中的“預(yù)覽”按紐預(yù)覽一下（如圖 8）。 （圖 8） 對于這個(gè) 網(wǎng)頁嘛，有些讀者會大罵：“什么破玩意，怎么見得了人呢！”可能另一些讀者會說：“哦，小寶貝，這是我做的第一個(gè)主頁，要好好保存起來?！惫?，具體你會怎么樣做筆者可猜不著了。怎么說也是第一個(gè)，也只能做到這種水平了：）如果你想學(xué)習(xí)把網(wǎng)頁做的更好看一點(diǎn)的話，歡迎你繼續(xù)閱讀本章的第二小節(jié)。 課后反思：學(xué)生們學(xué)的很認(rèn)真，沒有什么難點(diǎn)，這些在以前的課程中都涉及到，有共性。 30 第十 二 課時(shí)： 網(wǎng)頁的布局 [教學(xué)目標(biāo)： ] 使學(xué)生初步認(rèn)識 網(wǎng)頁版式，知道表格在網(wǎng)頁中的作用，會用表格規(guī)劃布局網(wǎng)頁 [課時(shí)安排： ] 1 課時(shí)。 [教學(xué)重點(diǎn)： ] 重點(diǎn)：網(wǎng)頁版式的設(shè)計(jì)和表格的建立。 難點(diǎn)：正確設(shè)置表格的屬性。 [教學(xué)過程： ] 導(dǎo)入： 上一節(jié)當(dāng)中我們做的網(wǎng)頁（如圖 8），給人的第一感覺除了是 “ 次 ” 的要死以外就是凌亂。 （圖 8） 31 網(wǎng)頁就是這樣，要想給人一種視覺上的沖擊或是享受，你就必須會搭配文字與圖片等等元素。 就圖 8 上面的這個(gè)網(wǎng)頁來說 吧，如果把文字和圖片擺在中間的話，感覺還會好一些。但是我們要怎么樣做才能更方便地把網(wǎng)頁上的元素整齊地?cái)[放好呢？這就要用到表格了。 表格在網(wǎng)頁中是用的最廣泛，也是用處最大的一個(gè)元素。 怎么樣在網(wǎng)頁中使用表格呢？我們點(diǎn)擊 Frontpage2020 控制窗菜單欄的 “ 表格 → 插入 → 表格 ” （如圖 9），在彈出的窗口中選擇要插入表格的要求（如圖 10）。選擇好之后按確定，就在你的網(wǎng)頁上插了表格了。 （圖 9） （圖 10） 我們新建一個(gè)網(wǎng)頁，選擇插入表格，在彈出的窗口中的“大小”欄里選擇行數(shù)為 2，列數(shù)為 1，邊框粗細(xì)，單元格邊距和單元格間距為 0，指定寬度為 100，并且是指百分比（如圖 10）。然后按確定，我們就在網(wǎng)頁里插入了兩行的表格（如圖 11）。 32 （圖 11） 接下來我們在第一行的表格里面打上自己喜歡的文字，并定義它的屬性。在第二行的表格里面插入一張圖片（如圖 12）。 （圖 12） （ 1）定 置表格 表格可以定置它的長寬，具體怎么做的？我們新建一個(gè)網(wǎng)頁，插入一個(gè)一行一列的表格。在表格內(nèi)點(diǎn)擊鼠標(biāo)右鍵，選擇表格屬性。在彈出的窗口中設(shè)置（如圖 1）。 33 （圖 1） 剛才說了，如果把文字和圖片移到網(wǎng)頁的中間就會比較好看，那我們現(xiàn)在就移動它。 具體怎么樣移呢？難道要我們可愛的讀者不停地在文字或者前面狂按空格鍵？不是的， 很簡單就可以做到了。 我們用鼠標(biāo)左鍵把表格括起來使里面的文字和圖片被選中，把鼠標(biāo)依到表格的頂端的邊緣線上上按左鍵，把它括起來（如圖 13） （圖 13） 括好之后我們按控制窗的按紐欄里面的居中按紐，使選中的內(nèi)容居中（如圖 14）。以后有需要你也可以使用按紐欄里面的做對齊，右對齊按紐。 （圖 14） 怎么樣？放在中間是不是好看了一點(diǎn)？ 34 接下來我們繼續(xù)編輯網(wǎng)頁里面的內(nèi)容，依舊使用表格和居中按紐，添加一些自己喜歡的內(nèi)容。 （圖 15） 課后反思：本節(jié)課布局這個(gè)概念 是個(gè)難點(diǎn)，但做表格，不難，因?yàn)樵谝郧暗?WORD 中也學(xué)習(xí)過，所以只要稍加點(diǎn)撥，學(xué)生就學(xué)會了。 35 第十三課時(shí)： 超級鏈接 [教學(xué)目標(biāo)： ] 知道超鏈接的作用及組成要素，了解超鏈接的種類，會根據(jù)需要設(shè)置書簽超鏈接。 [課時(shí)安排： ] 1 課時(shí)。 [教學(xué)重點(diǎn)： ] 重點(diǎn)：超鏈接的組成要素及創(chuàng)建超鏈接的一般方法。 難點(diǎn)：書簽超鏈接的設(shè)計(jì)與創(chuàng)建。 [教學(xué)過程： ] 導(dǎo)入： 超級連接是一個(gè)網(wǎng)站的靈魂?？梢赃@么說，超級連接就象人體內(nèi)的血管。人們的手如果缺少血管的話，那血液就不能流到手上，那手就不能運(yùn)動 了。網(wǎng)站也一樣，如果你的子文件做的非常非常好，但是沒有超級連接，瀏覽者就只能看到網(wǎng)站的主頁了，而不能看到后面的子文件了。所以，超級連接在網(wǎng)頁中起了很重要的作用。 36 不要以為很重要就很難學(xué)了，不是的。在 Frontpage2020 里做超級連接就象是打字一樣簡單：） 我們先不要管剛才做好的網(wǎng)頁，先把它保存起來。點(diǎn)按紐欄的保存按紐保存剛才做的網(wǎng)頁，由于是主頁，所以保存時(shí)的應(yīng)該把它命名為“ ” 或者是 “ ” （