FrontPage教程:編輯網(wǎng)頁
互聯(lián)網(wǎng) 發(fā)布時(shí)間:2008-10-17 19:42:23 作者:佚名
我要評論

第一課:FrontPage教程:網(wǎng)頁制作基礎(chǔ)知識
1.視圖與模式(一)
現(xiàn)在進(jìn)入FrontPage。單擊任務(wù)欄“開始”按鈕,選擇“程序”選項(xiàng),單擊“Microsoft FrontPage”選項(xiàng)就可以了。 可能你會(huì)發(fā)現(xiàn)FrontPage界面和Word很相似[圖2-1],這是因?yàn)榫?/div>
4.修飾文本
怎樣使文字更豐富、活潑呢?一個(gè)簡單的方法就是使用“格式”工具欄。
字體設(shè)置:選上文字,打開格式工具欄的“字體”下拉列表框,在里面選擇相應(yīng)的字體就可以了。如果瀏覽網(wǎng)頁的人使用的計(jì)算機(jī)沒有設(shè)置的字體?瀏覽器會(huì)用系統(tǒng)默認(rèn)的字體代替你設(shè)置的字體。不過,使用常用字體是一個(gè)好習(xí)慣。
字號設(shè)置:在“格式”工具欄“字號”下拉列表框中選擇相應(yīng)字體就可以了。
工具欄上的B、I、U圖標(biāo)的作用是:
按下B按鈕 ,被選中的文字就會(huì)變?yōu)榇煮w
按下I按鈕 ,被選中的文字就會(huì)變?yōu)樾斌w
按下u按鈕 ,被選中的文字就會(huì)帶下畫線
字的顏色:單擊“格式”工具欄“字體顏色”按鈕旁的向下箭頭[圖2-9],選擇適當(dāng)?shù)念伾?,字的顏色就改變了?br />
還可以對字體進(jìn)行一些其他設(shè)置。選擇“格式”菜單的“字體”命令,在這里我們還可以作進(jìn)一步的設(shè)置。這里除了“格式”工具欄可以做的設(shè)置以外,還可以設(shè)置許多效果。
“字符間距”選項(xiàng)卡:它是用來設(shè)置文字的間距的。單擊“間距”下拉列表,可以選擇字符的間距是普通、擴(kuò)充還是緊縮的。選擇擴(kuò)充,這時(shí)預(yù)覽框的文字間距就變大了。也可以調(diào)整間距大小來改變間距,輸入10,文字的間距就更大了。
“定位”下拉列表:在FrontPage中每一行都有一個(gè)底線,定位就是指文字相對于底線的距離。也就是把文字上下移動(dòng),現(xiàn)在選擇“上移”,文字就向上移動(dòng)了。預(yù)覽框中的黑線就是行的底線。
5.項(xiàng)目符號和編號
設(shè)計(jì)網(wǎng)頁應(yīng)該層次分明,結(jié)構(gòu)清晰。這可以通過FrontPage的列表功能解決。
選中要列表的內(nèi)容,單擊“格式”工具欄上的“項(xiàng)目符號”按鈕 ,默認(rèn)情況下,項(xiàng)目符號是一個(gè)小黑點(diǎn)。你也可以選擇其它的項(xiàng)目符號,單擊“格式”菜單,選擇“項(xiàng)目符號和編號”命令。選擇“圖片項(xiàng)目符號”選項(xiàng)卡,單擊“瀏覽”按鈕,點(diǎn)“剪貼畫”,再點(diǎn)Web符號按鈕,選擇合適的圖片,單擊“確定”按鈕。
對有順序的內(nèi)容列表可以使用編號。單擊“格式”菜單的“編號”按鈕 ?,F(xiàn)在有一個(gè)問題,“站點(diǎn)的主題”、“站點(diǎn)的共享邊框”兩行是屬于“設(shè)計(jì)站點(diǎn)風(fēng)格”的內(nèi)容,可是也編號了。解決的方法是把這兩項(xiàng)選中,單擊工具欄上的“增加縮進(jìn)”按鈕 ,再次單擊“增加縮進(jìn)”按鈕,這樣就可以了[圖2-12]。要把這兩項(xiàng)改為其他編號方式,可以選擇“格式”菜單的“項(xiàng)目符號和編號按鈕”,在編號框里選擇合適的編號形式,單擊“確定”按鈕。
怎樣解決列表分級太多而顯得不簡潔的問題?方法是把子列表折疊起來,稱為“折疊大綱”。將鼠標(biāo)光標(biāo)移到要折疊的列表的上一級處,單擊鼠標(biāo)右鍵,選擇“列表屬性”命令,將“啟用折疊大綱”和“開始時(shí)折疊復(fù)選框”選中,單擊“確定”按鈕。 打開它時(shí)只要單擊它就打開了。
6.插入水平線
在網(wǎng)頁中適時(shí)的插入水平線可以使層次分明。最簡單的方法是插入水平線使需要分隔的部分分開。把插入點(diǎn)調(diào)整到插入水平線的位置,選擇“插入”菜單的“水平線”命令。
雙擊插入的線條,在彈出的“水平線屬性”對話框里單擊“顏色”下拉列表, 選擇相應(yīng)的顏色,可以改變線條顏色。在對話框中有“窗口寬度百分比”和“像素”選項(xiàng),它們的作用是通過調(diào)整寬度數(shù)值設(shè)置線條的寬度,但是這個(gè)數(shù)值的單位卻是由它后面的選擇決定,調(diào)整“高度”的數(shù)值,可以改變線條高度。
單擊水平線,選中它。按ALT ENTER鍵,也可直接進(jìn)入水平線對話框。
水平線變化有限,裝飾性不強(qiáng)。我們還可以插入更豐富的線條來修飾頁面,那就是線條圖像。 線條圖像就是一個(gè)特別狹長的圖像。將水平線選中,按DEL鍵,將水平線刪除,選擇“插入”菜單的“圖片”命令,單擊“剪貼畫”選項(xiàng)。選擇“圖片”選項(xiàng)卡,這里把FrontPage提供的剪貼畫按類別放在了下面的列表框中,選擇“WEB框架”,選擇小石頭圖像,單擊“插入剪輯”按鈕。由小石頭構(gòu)成的線條就插入完成了。
如果想把線條縮短一點(diǎn),可以在線條上單擊鼠標(biāo)右鍵,選擇“圖像屬性”命令,打開“圖片屬性”對話框,選擇“外觀”選項(xiàng)卡,選擇“指定大小”,將寬度的單位設(shè)置為百分比,將寬度調(diào)整為80,單擊“確定”按鈕。
7.插入時(shí)間標(biāo)記
在Internet上我們經(jīng)常看到許多網(wǎng)頁上都有一個(gè)最新更新日期,用來告訴用戶頁面上一次更新是什么時(shí)候,這是怎么做的呢?看完下面的部分你就知道了。
時(shí)間標(biāo)記當(dāng)活動(dòng)網(wǎng)頁被重新編輯或自動(dòng)更新之后,會(huì)自動(dòng)改變。設(shè)置起來也很容易:在頁面末尾輸入:“更新時(shí)間”,執(zhí)行“插入”菜單的“日期與時(shí)間”命令,在“日期時(shí)間屬性”對話框中選擇“該網(wǎng)頁上次編輯日期”,如果要改變?nèi)掌诘母袷剑梢詥螕?ldquo;日期格式”下拉列表,選擇合適的格式。
8.插入注釋
怎么在網(wǎng)頁里插入注釋呢?(在我們創(chuàng)建編輯和修改網(wǎng)頁的過程中,經(jīng)常需要插入一些文字,表明設(shè)計(jì)的意圖和方法,在編輯網(wǎng)頁時(shí)作為參考和提示,這就是注釋。)
插入注釋的方法是:普通模式下單擊當(dāng)前網(wǎng)頁要插入注釋的位置,把插入點(diǎn)設(shè)置到那里。選擇“插入菜單”的“注釋”命令,這樣就會(huì)彈出“注釋”對話框,在“注釋”文本框中輸入注釋的內(nèi)容,單擊“確定”按鈕。
在指定的位置注釋出現(xiàn)了?,F(xiàn)在單擊“預(yù)覽”選項(xiàng)卡,切換到預(yù)覽模式,注釋沒有出現(xiàn)。 實(shí)際上注釋并不是在瀏覽器中顯示的網(wǎng)頁的一部分,瀏覽者通過瀏覽器是看不到網(wǎng)頁里的注釋的。
9.預(yù)覽新建頁面
設(shè)計(jì)好的頁面,應(yīng)該檢查它在瀏覽器中是否顯示正常。
方法是,一般只要切換到預(yù)覽模式就可以了。單擊“預(yù)覽”選項(xiàng)卡,在這個(gè)預(yù)覽模式下的顯示和在瀏覽器中的顯示是一樣的。但這并不意味著我們就不必用瀏覽器來檢查編輯的網(wǎng)頁了。因?yàn)榧词故峭粋€(gè)頁面,可能在不同的瀏覽器中顯示會(huì)不太一樣。比如在Internet Explorer中是這樣顯示的,但是在Netscape中又是那樣顯示的。所以,我們要在自己的機(jī)器上多裝幾個(gè)瀏覽器,用來檢查網(wǎng)頁的兼容性。
怎么用不同的瀏覽器來檢查呢?選擇“文件”菜單的“在瀏覽器中預(yù)覽”選項(xiàng),在瀏覽器列表框中選擇不同的瀏覽器[圖2-18]。(以Internet Explorer 5.0為例)單擊“確定”按鈕。就可以看到新建頁面在瀏覽器中的效果了。
這一部分內(nèi)容很簡單,但是這些內(nèi)容在制作網(wǎng)頁的過程中幾乎每次都會(huì)用到,“萬丈高樓平地起”,不要小看這些最基本的操作呀。
4.修飾文本
怎樣使文字更豐富、活潑呢?一個(gè)簡單的方法就是使用“格式”工具欄。
字體設(shè)置:選上文字,打開格式工具欄的“字體”下拉列表框,在里面選擇相應(yīng)的字體就可以了。如果瀏覽網(wǎng)頁的人使用的計(jì)算機(jī)沒有設(shè)置的字體?瀏覽器會(huì)用系統(tǒng)默認(rèn)的字體代替你設(shè)置的字體。不過,使用常用字體是一個(gè)好習(xí)慣。
字號設(shè)置:在“格式”工具欄“字號”下拉列表框中選擇相應(yīng)字體就可以了。
工具欄上的B、I、U圖標(biāo)的作用是:
按下B按鈕 ,被選中的文字就會(huì)變?yōu)榇煮w
按下I按鈕 ,被選中的文字就會(huì)變?yōu)樾斌w
按下u按鈕 ,被選中的文字就會(huì)帶下畫線
字的顏色:單擊“格式”工具欄“字體顏色”按鈕旁的向下箭頭[圖2-9],選擇適當(dāng)?shù)念伾?,字的顏色就改變了?br />

還可以對字體進(jìn)行一些其他設(shè)置。選擇“格式”菜單的“字體”命令,在這里我們還可以作進(jìn)一步的設(shè)置。這里除了“格式”工具欄可以做的設(shè)置以外,還可以設(shè)置許多效果。
“字符間距”選項(xiàng)卡:它是用來設(shè)置文字的間距的。單擊“間距”下拉列表,可以選擇字符的間距是普通、擴(kuò)充還是緊縮的。選擇擴(kuò)充,這時(shí)預(yù)覽框的文字間距就變大了。也可以調(diào)整間距大小來改變間距,輸入10,文字的間距就更大了。
“定位”下拉列表:在FrontPage中每一行都有一個(gè)底線,定位就是指文字相對于底線的距離。也就是把文字上下移動(dòng),現(xiàn)在選擇“上移”,文字就向上移動(dòng)了。預(yù)覽框中的黑線就是行的底線。
5.項(xiàng)目符號和編號
設(shè)計(jì)網(wǎng)頁應(yīng)該層次分明,結(jié)構(gòu)清晰。這可以通過FrontPage的列表功能解決。
選中要列表的內(nèi)容,單擊“格式”工具欄上的“項(xiàng)目符號”按鈕 ,默認(rèn)情況下,項(xiàng)目符號是一個(gè)小黑點(diǎn)。你也可以選擇其它的項(xiàng)目符號,單擊“格式”菜單,選擇“項(xiàng)目符號和編號”命令。選擇“圖片項(xiàng)目符號”選項(xiàng)卡,單擊“瀏覽”按鈕,點(diǎn)“剪貼畫”,再點(diǎn)Web符號按鈕,選擇合適的圖片,單擊“確定”按鈕。
對有順序的內(nèi)容列表可以使用編號。單擊“格式”菜單的“編號”按鈕 ?,F(xiàn)在有一個(gè)問題,“站點(diǎn)的主題”、“站點(diǎn)的共享邊框”兩行是屬于“設(shè)計(jì)站點(diǎn)風(fēng)格”的內(nèi)容,可是也編號了。解決的方法是把這兩項(xiàng)選中,單擊工具欄上的“增加縮進(jìn)”按鈕 ,再次單擊“增加縮進(jìn)”按鈕,這樣就可以了[圖2-12]。要把這兩項(xiàng)改為其他編號方式,可以選擇“格式”菜單的“項(xiàng)目符號和編號按鈕”,在編號框里選擇合適的編號形式,單擊“確定”按鈕。
怎樣解決列表分級太多而顯得不簡潔的問題?方法是把子列表折疊起來,稱為“折疊大綱”。將鼠標(biāo)光標(biāo)移到要折疊的列表的上一級處,單擊鼠標(biāo)右鍵,選擇“列表屬性”命令,將“啟用折疊大綱”和“開始時(shí)折疊復(fù)選框”選中,單擊“確定”按鈕。 打開它時(shí)只要單擊它就打開了。
6.插入水平線
在網(wǎng)頁中適時(shí)的插入水平線可以使層次分明。最簡單的方法是插入水平線使需要分隔的部分分開。把插入點(diǎn)調(diào)整到插入水平線的位置,選擇“插入”菜單的“水平線”命令。
雙擊插入的線條,在彈出的“水平線屬性”對話框里單擊“顏色”下拉列表, 選擇相應(yīng)的顏色,可以改變線條顏色。在對話框中有“窗口寬度百分比”和“像素”選項(xiàng),它們的作用是通過調(diào)整寬度數(shù)值設(shè)置線條的寬度,但是這個(gè)數(shù)值的單位卻是由它后面的選擇決定,調(diào)整“高度”的數(shù)值,可以改變線條高度。
單擊水平線,選中它。按ALT ENTER鍵,也可直接進(jìn)入水平線對話框。
水平線變化有限,裝飾性不強(qiáng)。我們還可以插入更豐富的線條來修飾頁面,那就是線條圖像。 線條圖像就是一個(gè)特別狹長的圖像。將水平線選中,按DEL鍵,將水平線刪除,選擇“插入”菜單的“圖片”命令,單擊“剪貼畫”選項(xiàng)。選擇“圖片”選項(xiàng)卡,這里把FrontPage提供的剪貼畫按類別放在了下面的列表框中,選擇“WEB框架”,選擇小石頭圖像,單擊“插入剪輯”按鈕。由小石頭構(gòu)成的線條就插入完成了。
如果想把線條縮短一點(diǎn),可以在線條上單擊鼠標(biāo)右鍵,選擇“圖像屬性”命令,打開“圖片屬性”對話框,選擇“外觀”選項(xiàng)卡,選擇“指定大小”,將寬度的單位設(shè)置為百分比,將寬度調(diào)整為80,單擊“確定”按鈕。
7.插入時(shí)間標(biāo)記
在Internet上我們經(jīng)常看到許多網(wǎng)頁上都有一個(gè)最新更新日期,用來告訴用戶頁面上一次更新是什么時(shí)候,這是怎么做的呢?看完下面的部分你就知道了。
時(shí)間標(biāo)記當(dāng)活動(dòng)網(wǎng)頁被重新編輯或自動(dòng)更新之后,會(huì)自動(dòng)改變。設(shè)置起來也很容易:在頁面末尾輸入:“更新時(shí)間”,執(zhí)行“插入”菜單的“日期與時(shí)間”命令,在“日期時(shí)間屬性”對話框中選擇“該網(wǎng)頁上次編輯日期”,如果要改變?nèi)掌诘母袷剑梢詥螕?ldquo;日期格式”下拉列表,選擇合適的格式。
8.插入注釋
怎么在網(wǎng)頁里插入注釋呢?(在我們創(chuàng)建編輯和修改網(wǎng)頁的過程中,經(jīng)常需要插入一些文字,表明設(shè)計(jì)的意圖和方法,在編輯網(wǎng)頁時(shí)作為參考和提示,這就是注釋。)
插入注釋的方法是:普通模式下單擊當(dāng)前網(wǎng)頁要插入注釋的位置,把插入點(diǎn)設(shè)置到那里。選擇“插入菜單”的“注釋”命令,這樣就會(huì)彈出“注釋”對話框,在“注釋”文本框中輸入注釋的內(nèi)容,單擊“確定”按鈕。
在指定的位置注釋出現(xiàn)了?,F(xiàn)在單擊“預(yù)覽”選項(xiàng)卡,切換到預(yù)覽模式,注釋沒有出現(xiàn)。 實(shí)際上注釋并不是在瀏覽器中顯示的網(wǎng)頁的一部分,瀏覽者通過瀏覽器是看不到網(wǎng)頁里的注釋的。
9.預(yù)覽新建頁面
設(shè)計(jì)好的頁面,應(yīng)該檢查它在瀏覽器中是否顯示正常。
方法是,一般只要切換到預(yù)覽模式就可以了。單擊“預(yù)覽”選項(xiàng)卡,在這個(gè)預(yù)覽模式下的顯示和在瀏覽器中的顯示是一樣的。但這并不意味著我們就不必用瀏覽器來檢查編輯的網(wǎng)頁了。因?yàn)榧词故峭粋€(gè)頁面,可能在不同的瀏覽器中顯示會(huì)不太一樣。比如在Internet Explorer中是這樣顯示的,但是在Netscape中又是那樣顯示的。所以,我們要在自己的機(jī)器上多裝幾個(gè)瀏覽器,用來檢查網(wǎng)頁的兼容性。
怎么用不同的瀏覽器來檢查呢?選擇“文件”菜單的“在瀏覽器中預(yù)覽”選項(xiàng),在瀏覽器列表框中選擇不同的瀏覽器[圖2-18]。(以Internet Explorer 5.0為例)單擊“確定”按鈕。就可以看到新建頁面在瀏覽器中的效果了。
這一部分內(nèi)容很簡單,但是這些內(nèi)容在制作網(wǎng)頁的過程中幾乎每次都會(huì)用到,“萬丈高樓平地起”,不要小看這些最基本的操作呀。
相關(guān)文章
FrontPage網(wǎng)頁中怎么插入視頻? FrontPage視頻插入技巧
FrontPage網(wǎng)頁中怎么插入視頻?FrontPage創(chuàng)建的網(wǎng)頁想要插入視頻,該怎么插入視頻并調(diào)整視頻大小呢?下面我們就來看看FrontPage視頻插入技巧,需要的朋友可以參考下2021-03-05FrontPage怎么自定義設(shè)置CSS外部樣式表?
FrontPage怎么自定義設(shè)置CSS外部樣式表?FrontPage中想要自己制作一個(gè)樣式表,該怎么自定義設(shè)置呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2019-05-22- FrontPage怎么制作作網(wǎng)頁下拉菜單?FrontPage制作網(wǎng)頁的時(shí)候,需要給網(wǎng)頁添加下拉菜單,該怎么制作這個(gè)效果呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2019-05-21
FrontPage怎么添加選項(xiàng)按鈕? FrontPage選項(xiàng)按鈕添加方法
FrontPage怎么添加選項(xiàng)按鈕?FrontPage制作網(wǎng)頁的時(shí)候,想要插入選項(xiàng)按鈕,該怎么插入呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2019-05-21FrontPage怎么使用復(fù)選框? FrontPage復(fù)選框的用法
FrontPage怎么使用復(fù)選框?FrontPage制作網(wǎng)頁的時(shí)候,想啊喲使用復(fù)選框,該怎么使用復(fù)選框呢?下面我們就來看看FrontPage復(fù)選框的用法,需要的朋友可以參考下2019-05-20FrontPage怎么創(chuàng)建留言簿網(wǎng)頁?
FrontPage怎么創(chuàng)建留言簿網(wǎng)頁?FrontPage中想要制作一個(gè)網(wǎng)頁,該怎么制作留言簿呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2019-05-20- FrontPage框架怎么拆分與合并?FrontPage中創(chuàng)建的框架網(wǎng)頁想要對王佳進(jìn)行拆分和合并操作,該怎么辦呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2019-04-30
- FrontPage怎么啟用超鏈接翻轉(zhuǎn)效果?FrontPage給網(wǎng)頁添加超鏈接以后,想要添加動(dòng)態(tài)效果,比如鼠標(biāo)鼠標(biāo)懸或單擊超鏈接時(shí),鏈接外觀所產(chǎn)生的變化效果,下面我們就來看看詳細(xì)的2019-04-17
- FrontPage超鏈接默認(rèn)顏色怎么修改?FrontPage中想要設(shè)置超鏈接默認(rèn)的顏色,比如已訪問的超鏈接和當(dāng)前超鏈接的顏色,該怎么設(shè)置呢?下面我們就來看看詳細(xì)的教程,需要的朋友2019-04-17
- 這篇文章主要介紹了詳解基于瀏覽器同源策略的幾種跨域方式的相關(guān)資料,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-09-03