2008年5月19日 星期一

FrontPage的框架設定

框架頁面可以讓網頁共用某些頁面區域(例如選單頁),我們來看看在FrontPage裡怎樣做框架設定...

框架設定:按一下檔案/開新檔案/網頁(一定要從此進入,不能從功能表列的框架進入)
wpe14


選擇框架頁(本例選為左右分割的內容選項)
wpe15

會出現如下圖的左右灰色畫面,如果先前還沒有做好其它網頁,則左右兩邊皆按下開新網頁鈕。
wpe16

並把兩邊網頁換上不同底色以方便等一下觀看結果時有較明顯分別。
wpe17
框架頁編輯:

在編輯畫面灰色框架線按住滑鼠左鍵拖曳,能夠改變左右分割區域大小。

wpe18

在編輯畫面灰色框架線按住滑鼠右鍵,會顯示出框架內容,按下滑鼠左鍵進入。
wpe19

框架內容裡有許多設定可供調整,如果你不希望網友瀏覽你的網站時能拖曳分割區大小,請取消在瀏覽器中可以調大小前的勾號。
wpe1A

再按下框架頁按鈕
wpe1B

將顯示框線前的勾號取消,以免畫面中總是有灰色分割線不美觀。
wpe1C

結果如下
wpe1D

框架頁存檔:

按下存檔鈕會出現另存新檔畫面,先存左邊頁面(檔名可自訂)
wpe1E

再存右邊頁面(檔名可自訂)
wpe1F

最後存整個頁面(檔名可自訂),在此講解一下其原理,原來網頁上看到分割成左右兩頁的畫面,都事先連到最後存的這個頁面,此頁面只是紀錄左邊要顯示什麼檔案、右邊要顯示什麼檔案,實際上這整個頁面只是做個分割畫面該指向哪幾個檔的動作。

框架連結目標:
確認如果你按照以上步驟現在應有frame、left、news等3個htm檔案,並產生一個一般空白頁面為who.htm
wpe21

開啟frame.htm,在左邊頁面輸入文字(如最新消息、站長簡介),分別反白選擇超連結點到news.htm與who.htm
wpe22

試一下到瀏覽器時按左方選單則右方會不會變化內容。
wpe23
下載範例檔請按此


0 意見:

張貼留言

若對於本篇文章有任何批評指教或鼓勵建議,歡迎您留言讓我知道...

Related Posts Plugin for WordPress, Blogger...