Dreamweaver網(wǎng)設(shè)計(jì)8培訓(xùn)資料課件

第8章框架8.1框架的基本概念8.2創(chuàng)建框架集8.3保存框架和框架集8.4設(shè)置框架和框架集的屬性8.5框架實(shí)例8.6模板思考與練習(xí)1第一頁(yè)，共七十五頁(yè)。圖8.12第二頁(yè)，共七十五頁(yè)。8.1框架的基本概念框架（Frame）就是瀏覽器窗口的一個(gè)區(qū)域，在這個(gè)區(qū)域中可以顯示一個(gè)單獨(dú)的文檔（頁(yè)面）而不影響另一個(gè)區(qū)域中的顯示內(nèi)容?？蚣苡掷斫鉃橐粋€(gè)能獨(dú)立顯示的文檔。在一個(gè)頁(yè)面上可以分出多個(gè)區(qū)域，設(shè)置多個(gè)框架。把這些框架看成一個(gè)整體，就稱(chēng)為框架集（Frameset）?？蚣芗x了窗口的一種布局結(jié)構(gòu)。使用框架技術(shù)不僅可以布局版面，更多的是用于需要通過(guò)目錄、索引來(lái)閱讀內(nèi)容的導(dǎo)航，也用于網(wǎng)頁(yè)的導(dǎo)航條，因?yàn)橛盟喿x鏈接內(nèi)容時(shí)，可以不破壞版面的結(jié)構(gòu)，不破壞目錄或?qū)Ш綏l的導(dǎo)航作用，處在什么位置，一目了然。3第三頁(yè)，共七十五頁(yè)。在HTML中，框架集用<Frameset></Frameset>來(lái)標(biāo)記，框架用<Frame></Frame>標(biāo)記。圖8.1所示頁(yè)面框架的HTML標(biāo)記為：<framesetcols=″224,*″frameborder=0border=″0″framespacing=0><framesetrows=″124,*,61,0″frameborder=0border=″0″framespacing=0><framesrc=″html/navigation.htm″name=″mm_navigation″scrolling=″no″resize=″no″marginheight=″0″marginwidth=″0″><framesrc=″html/cont.htm″name=″left″scrolling=″yes″resize=″no″marginheight=″0″marginwidth=″5″border=″0″>4第四頁(yè)，共七十五頁(yè)。<framesrc=″html/other_refs_nav.htm″name=″other_navigation″scrolling=″no″resize=″no″marginheight=″0″marginwidth=″0″></frameset><framesetrows=″*,0″border=″0″frameborder=0framespacing=0><framesrc=″contextID.html″name=″right″scrolling=″auto″resize=″yes″marginwidth=″20″marginheight=″5″></frameset></frameset>該例說(shuō)明，框架集可以嵌套，可以查看文件Program4|Help|UsingDreamweaver|ContextHelp.htm。5第五頁(yè)，共七十五頁(yè)。8.2創(chuàng)建框架集8.2.1創(chuàng)建框架集為敘述方便，從一個(gè)空文檔開(kāi)始創(chuàng)建框架集，其他兩種情況的創(chuàng)建方法完全相同。假設(shè)已創(chuàng)建了一個(gè)新的空白文檔?！纠?.1】創(chuàng)建框架集①單擊要分割框架的窗口，將插入點(diǎn)放置入窗口中。如果已經(jīng)存在框架，則需要單擊某個(gè)框架窗格，將插入點(diǎn)放入該窗格內(nèi)。②打開(kāi)Frame（框架）對(duì)象面板（見(jiàn)圖8.2）。③在框架對(duì)象面板上單擊相應(yīng)的按鈕，或直接將按鈕拖動(dòng)到文檔窗口中，即可在當(dāng)前文檔窗口中構(gòu)建出相應(yīng)格式的框架，框架以灰色線條分割（見(jiàn)圖8.3）。6第六頁(yè)，共七十五頁(yè)。圖8.27第七頁(yè)，共七十五頁(yè)。圖8.38第八頁(yè)，共七十五頁(yè)。注意：在框架對(duì)象面板中，命名InsertLeftFrame(插入左框架)的按鈕，實(shí)際上建立有兩個(gè)框架的框架集，一個(gè)叫左（Left）框架，一個(gè)叫主框架（MainFrame）。在按鈕圖標(biāo)中，白色部分（左邊）表示左框架，藍(lán)色部分（右邊）表示主框架，而不是一個(gè)框架。其他框架對(duì)象類(lèi)似。如圖8.3，單擊“上、左嵌套框架”按鈕，建立了一個(gè)上、下左形式的框架集。④如果在圖8.3所示的框架集中的某個(gè)框架中再次單擊插入框架集按鈕，則可以創(chuàng)建嵌套框架。如在圖8.3MainFrame框架中單擊“創(chuàng)建下框架”按鈕，建立的嵌套框架如圖8.4。9第九頁(yè)，共七十五頁(yè)。圖8.410第十頁(yè)，共七十五頁(yè)。注意：從圖8.4看到，創(chuàng)建下框架時(shí)，原來(lái)框架中的內(nèi)容被分割在了上邊。實(shí)際上，如果要?jiǎng)?chuàng)建框架的頁(yè)面或使框架中有內(nèi)容，則需內(nèi)容被分割在MainFrame(主框架)中，就是對(duì)象按鈕圖標(biāo)中的藍(lán)色區(qū)域。⑤創(chuàng)建框架集后，執(zhí)行Window|Frames（框架集）命令，打開(kāi)Frames可?？扛?dòng)面板，可以清晰地看到框架的結(jié)構(gòu)，單擊其中的區(qū)域，可以選定框架（見(jiàn)圖8.5）。提示：創(chuàng)建框架集還可以使用Insert|Frames(插入|框架集)命令。技巧：頁(yè)面中的框架用灰線分割，用鼠標(biāo)拖動(dòng)分割線，可以調(diào)整框架區(qū)域的大小。11第十一頁(yè)，共七十五頁(yè)。圖8.512第十二頁(yè)，共七十五頁(yè)。在頁(yè)面中建立框架后，文檔頁(yè)面四周顯示框架邊框，在邊框上按下鼠標(biāo)向窗口內(nèi)拖動(dòng)，可以繼續(xù)分割框架(見(jiàn)圖8.6)。使用Modify|Frameset命令(見(jiàn)圖8.7)，可以將一個(gè)框架左（left）右(right)或上（up）下(down)拆分為兩個(gè)框架，多次使用，可以將一個(gè)框架拆分為多個(gè)框架。8.2.2在框架中添加內(nèi)容框架集定義了一種頁(yè)面分割結(jié)構(gòu)，每一個(gè)框架可以顯示一個(gè)單獨(dú)的網(wǎng)頁(yè)，也即每個(gè)框架就是一個(gè)網(wǎng)頁(yè)。將插入點(diǎn)定位在某框架中，就可以像編輯普通網(wǎng)頁(yè)一樣編輯框架網(wǎng)頁(yè)，插入文本、表格、圖像、格式化等（見(jiàn)圖8.8）。如果框架中的內(nèi)容超出框架范圍，會(huì)自動(dòng)顯示滾動(dòng)條，拖動(dòng)滾動(dòng)滑塊，可以顯示窗口外的內(nèi)容。13第十三頁(yè)，共七十五頁(yè)。圖8.614第十四頁(yè)，共七十五頁(yè)。圖8.715第十五頁(yè)，共七十五頁(yè)。圖8.816第十六頁(yè)，共七十五頁(yè)。8.2.3建立超鏈接在圖8.9所示的框架網(wǎng)頁(yè)左下角的框架中有一個(gè)指向首頁(yè)的鏈接，單擊該鏈接，首頁(yè)在該框架中顯示（見(jiàn)圖8.10），而首頁(yè)中的“紅樓夢(mèng)”是指向圖8.9的鏈接，如果多次單擊首頁(yè)中的“紅樓夢(mèng)”和“紅樓夢(mèng)人物”中的“首頁(yè)”，在瀏覽器中就會(huì)形成網(wǎng)頁(yè)顯示上的嵌套（見(jiàn)圖8.11），此非人們所愿。不過(guò)，這種情況可以通過(guò)超鏈接的Target屬性來(lái)解決。所以在設(shè)置框架中的超鏈接時(shí)，一定要特別注意Target屬性的設(shè)置。17第十七頁(yè)，共七十五頁(yè)。圖8.918第十八頁(yè)，共七十五頁(yè)。圖8.1019第十九頁(yè)，共七十五頁(yè)。圖8.1120第二十頁(yè)，共七十五頁(yè)?！纠?.3】在框架中建立超鏈接①選中要建立超鏈接的對(duì)象，文字、圖像等。②在屬性面板中的Link（鏈接）對(duì)話框中輸入目標(biāo)端點(diǎn)的URL地址，或單擊后面的文件夾按鈕從磁盤(pán)選擇文件。③在Link右邊的Target（目標(biāo)）文本框中輸入打開(kāi)目標(biāo)網(wǎng)頁(yè)的位置，或從后面的下拉列表中選擇（見(jiàn)圖8.12）。_blank：表示將開(kāi)啟一個(gè)新的瀏覽器窗口，并載入鏈接目標(biāo)錨端的文檔。_parent：在當(dāng)前的瀏覽器的整個(gè)窗口中顯示鏈接目標(biāo)錨端的文檔。_self：在鏈接所在的框架中顯示鏈接目標(biāo)錨端的文檔。21第二十一頁(yè)，共七十五頁(yè)。圖8.1222第二十二頁(yè)，共七十五頁(yè)。_top：在當(dāng)前整個(gè)瀏覽器窗口顯示鏈接目標(biāo)錨端的文檔內(nèi)容，效果同_parent。以上四項(xiàng)即使不是在框架中建立鏈接，也是可以選擇的。只是_blank較常用，默認(rèn)是_parent。在有框架的文檔中建立超鏈接，下拉列表中還會(huì)列出當(dāng)前各個(gè)框架的名字，可以選擇在哪個(gè)框架中顯示目標(biāo)。在圖8.12中：mainFrame表示在名為mainFrame框架中顯示目標(biāo)；leftFrame表示在名為leftFrame框架中顯示目標(biāo)；topFrame表示在名為topFrame框架中顯示目標(biāo)。在圖8.9中，右下部的框架，即“主頁(yè)”鏈接所在框架是mainFrame，圖8.10顯示的Target屬性取值是mainFrame或_self時(shí)的情形，取值為leftFrame和topFrame的情形見(jiàn)圖8.13和圖8.14。如果選擇_top，則返回首頁(yè)時(shí)，會(huì)以整個(gè)瀏覽器窗口顯示。23第二十三頁(yè)，共七十五頁(yè)。圖8.1324第二十四頁(yè)，共七十五頁(yè)。圖8.1425第二十五頁(yè)，共七十五頁(yè)。8.2.4瀏覽器不支持框架時(shí)的處理在Internet上存在著各種各樣的瀏覽器，有些瀏覽器甚至是基于字符模式的，所以不是所有的瀏覽器都一定支持框架技術(shù)。如果主頁(yè)使用了框架技術(shù)，則不支持框架技術(shù)的瀏覽器就不能正常顯示。在遇到這種情況時(shí)，一般應(yīng)該在框架集文檔中顯示一些提示信息，告訴用戶當(dāng)前網(wǎng)頁(yè)使用了框架技術(shù)，需要使用支持框架的瀏覽器觀看，也可以制作沒(méi)有使用框架技術(shù)的網(wǎng)頁(yè)，在瀏覽器不支持框架時(shí)顯示該頁(yè)。在HTML中，當(dāng)瀏覽器不支持框架時(shí)，會(huì)顯示標(biāo)記<Noframes>和</Noframes>之間的內(nèi)容。如果瀏覽器支持框架，則會(huì)完全忽略<Noframes>和</Noframes>標(biāo)記間的內(nèi)容。26第二十六頁(yè)，共七十五頁(yè)。在Dreamweaver中，創(chuàng)建框架時(shí)已經(jīng)在HTML中加入了下列語(yǔ)句：<noframes><bodybgcolor=″#FFFFFF″text=″#000000″></body></noframes>需要做的就是在<Body>和</Body>之間要顯示的主體內(nèi)容?？梢允且痪涮崾拘畔ⅲ纾骸氨揪W(wǎng)頁(yè)需要使用支持框架技術(shù)的瀏覽器瀏覽”，或是一個(gè)不使用框架的完整網(wǎng)頁(yè)。要編輯該頁(yè)，可以使用以下方法：①執(zhí)行Modify|Frameset|EditNoframesContent（編輯非框架內(nèi)容）命令；27第二十七頁(yè)，共七十五頁(yè)。②這時(shí)文檔窗口變?yōu)橐粋€(gè)普通的文檔窗口，可以在其中編輯非框架信息，這實(shí)際上也是一個(gè)網(wǎng)頁(yè)，只是其中不應(yīng)再使用框架；③編輯完畢，再次執(zhí)行Modify|Frameset|EditNoframesContent命令，可以返回到原先的框架集文檔窗口中。28第二十八頁(yè)，共七十五頁(yè)。8.3保存框架和框架集在含有框架的文檔中，一個(gè)框架就是一個(gè)網(wǎng)頁(yè)，對(duì)應(yīng)一個(gè)HTML文件，稱(chēng)為框架文件。保存含有框架的網(wǎng)頁(yè)時(shí)，除需要保存各個(gè)框架文件外，還需要保存一個(gè)記錄框架結(jié)構(gòu)的文件，可稱(chēng)這個(gè)文件為框架集文件。它也是一個(gè)HTML文件，但不包括任何網(wǎng)頁(yè)中的具體內(nèi)容，只是定義了框架結(jié)構(gòu)和每個(gè)框架對(duì)應(yīng)的網(wǎng)頁(yè)文件名。瀏覽時(shí)通過(guò)該文件將各個(gè)框架文件顯示在相應(yīng)的框架中。所以，如果一個(gè)框架集中包含左右兩個(gè)框架，則實(shí)際上應(yīng)該保存3個(gè)文件，一個(gè)是框架集文件，一個(gè)是左方框架對(duì)應(yīng)的文件，另一個(gè)是右方框架對(duì)應(yīng)的文件。29第二十九頁(yè)，共七十五頁(yè)。在Dreamweaver中，可以單獨(dú)保存某個(gè)框架文件，或保存框架集文件本身，也可以將整個(gè)框架集（包括框架集文件和其中的各個(gè)框架文件）保存。注意：預(yù)覽含有框架的網(wǎng)頁(yè)效果，必須將各個(gè)框架文檔以及框架集文檔存儲(chǔ)到磁盤(pán)上。8.3.1存儲(chǔ)框架集文檔保存框架集結(jié)構(gòu)的操作如下：①在Frames(框架)浮動(dòng)面板中單擊任何一個(gè)框架；②執(zhí)行Frameset（保存框架集）命令（見(jiàn)圖8.15），即可保存框架集文檔；③如果框架集文檔尚未存儲(chǔ)，則會(huì)打開(kāi)文件存儲(chǔ)對(duì)話框，允許選擇存儲(chǔ)路徑并輸入文件名稱(chēng)，單擊Save（保存）按鈕，即可保存框架集；30第三十頁(yè)，共七十五頁(yè)。圖8.1531第三十一頁(yè)，共七十五頁(yè)。如果框架集文件已經(jīng)被存儲(chǔ)過(guò)，則該操作將在原先的基礎(chǔ)上再次保存文檔內(nèi)容，不會(huì)再出現(xiàn)文件存儲(chǔ)對(duì)話框；④如果希望將框架集文檔以另外的名稱(chēng)保存，執(zhí)行FramesetAs（框架集另存為）命令。8.3.2存儲(chǔ)框架文檔①在框架集文檔窗口中，在要保存的框架文檔中單擊，將插入點(diǎn)放置到該框架中；②執(zhí)行Frame（保存框架）命令（見(jiàn)圖8.16），即可保存該框架文檔；③如果框架文檔尚未存儲(chǔ)，則會(huì)打開(kāi)文件存儲(chǔ)對(duì)話框，允許選擇存儲(chǔ)路徑并輸入文件名，單擊Save按鈕，保存該框架文檔。32第三十二頁(yè)，共七十五頁(yè)。圖8.1633第三十三頁(yè)，共七十五頁(yè)。如果已經(jīng)保存過(guò)該框架文檔，則該操作只是再次在原先基礎(chǔ)上保存框架文檔，不會(huì)出現(xiàn)文件存儲(chǔ)對(duì)話框。8.3.3存儲(chǔ)框架集及所有的文檔【例8.4】保存框架集和框架文檔①執(zhí)行AllFrames命令。②如果有文檔（包括框架集文檔或框架文檔）尚未被保存，則會(huì)出現(xiàn)文件存儲(chǔ)對(duì)話框，提示選擇存儲(chǔ)路徑并輸入文件名稱(chēng)。單擊Save按鈕，即可保存這些文檔。如果有多個(gè)文檔尚未保存，則會(huì)依次出現(xiàn)多個(gè)文件存儲(chǔ)對(duì)話框。如果所有的文檔都已經(jīng)被保存過(guò)，則直接保存文件，而不會(huì)出現(xiàn)文件存儲(chǔ)對(duì)話框。34第三十四頁(yè)，共七十五頁(yè)。8.3.4打開(kāi)框架和框架集文檔框架文檔就是一般的網(wǎng)頁(yè)文件，可以單獨(dú)像一般網(wǎng)頁(yè)文件一樣打開(kāi)并編輯。單獨(dú)打開(kāi)框架文件，不顯示框架。而框架集文檔則記錄框架結(jié)構(gòu)及所鏈接的框架文檔。打開(kāi)框架集文檔，顯示框架結(jié)構(gòu)，同時(shí)載入各個(gè)框架文檔。35第三十五頁(yè)，共七十五頁(yè)。8.4設(shè)置框架和框架集的屬性框架的屬性包括框架的名稱(chēng)、源文件、空白邊距、滾動(dòng)特性、重設(shè)大小特性以及邊框特性等?？蚣芗膶傩钥梢钥刂瓶蚣芗恼w屬性，例如框架的尺寸、顏色、框架之間邊框的寬度等。在Dreamweaver中，通過(guò)屬性面板和框架浮動(dòng)面板，可以完成絕大多數(shù)的屬性設(shè)置操作。8.4.1框架浮動(dòng)面板框架浮動(dòng)面板即框架可?？扛?dòng)面板，簡(jiǎn)稱(chēng)框架面板，它顯示了頁(yè)面的框架結(jié)構(gòu)。執(zhí)行Window|Frames命令，圖8.17框架面板或按下Ctrl+F10鍵，可以打開(kāi)或關(guān)閉框架面板（見(jiàn)圖8.17）。36第三十六頁(yè)，共七十五頁(yè)。圖8.1737第三十七頁(yè)，共七十五頁(yè)。在框架面板中，顯示當(dāng)前框架集文檔窗口中已經(jīng)出現(xiàn)的框架窗格結(jié)構(gòu)，同時(shí)在不同的框架區(qū)域中，還顯示該框架的名稱(chēng)。在框架集文檔窗口中建立框架、刪除框架、修改框架的尺寸或名稱(chēng)時(shí)，框架面板上的顯示都會(huì)發(fā)生相應(yīng)的變化。8.4.2選中框架和框架集要設(shè)置框架和框架集的屬性，首先必須確定設(shè)置哪個(gè)框架的屬性。1.用框架面板選中框架或框架集要選中某個(gè)框架，可以直接在框架面板上單擊對(duì)應(yīng)的區(qū)域中任意位置。被選中的框架區(qū)域四周會(huì)出現(xiàn)黑色邊框，在文檔窗口中相應(yīng)框架周?chē)@示虛線。要選中框架集，可以單擊框架面板四周的框架邊框,這時(shí)整個(gè)框架面板區(qū)域四周顯示粗黑邊框，文檔窗口中該框架集的所有框架周?chē)紩?huì)顯示虛線。38第三十八頁(yè)，共七十五頁(yè)。圖8.18是用框架面板選中框架，而圖8.19是用框架面板選中框架集。注意，這是一個(gè)嵌套框架，選中的是一個(gè)子框架集。2.在文檔窗口中選中框架或框架集在文檔窗口中，按住Alt鍵，然后單擊要選中的框架窗格中的任意位置，即可選中該框架。被選中的框架四周會(huì)出現(xiàn)虛線。在文檔窗口中直接單擊框架邊框，即可選中框架集。選中框架集時(shí)，所有的框架邊框上都會(huì)顯示虛線。8.4.3設(shè)置框架屬性要設(shè)置框架屬性，首先要選中框架，然后在屬性面板中設(shè)置相應(yīng)屬性。選中框架時(shí)的屬性面板如圖8.20所示。39第三十九頁(yè)，共七十五頁(yè)。圖8.1840第四十頁(yè)，共七十五頁(yè)。圖8.1941第四十一頁(yè)，共七十五頁(yè)。圖8.2042第四十二頁(yè)，共七十五頁(yè)。1.框架名稱(chēng)為每一個(gè)框架指定一個(gè)名稱(chēng)，以便在超鏈接的Target屬性以及JavaScript等描述語(yǔ)言中引用框架?？蚣苊Q(chēng)在FrameName（框架名稱(chēng)）下面的文本框中設(shè)置。實(shí)際上在用對(duì)象按鈕或命令建立框架時(shí)，Dreamweaver按位置為每一個(gè)框架設(shè)置了默認(rèn)名稱(chēng)，如果需要修改，可以在該文本框中重新輸入需要的名稱(chēng)。框架的名稱(chēng)可以是字母和數(shù)字，其中可以出現(xiàn)短下劃線符號(hào)（_），但是不能出現(xiàn)連字號(hào)（）、句點(diǎn)（.）以及空格?？蚣艿拿Q(chēng)可以以字母開(kāi)頭，不能用數(shù)字開(kāi)頭。并且需要注意，不要使用JavaScript的保留關(guān)鍵字，如top或navigator等。43第四十三頁(yè)，共七十五頁(yè)。2.框架源框架源即框架源文件，實(shí)際就是框架文件，事實(shí)上不必直接在框架中編輯框架網(wǎng)頁(yè)，而可以指定任何一個(gè)網(wǎng)頁(yè)文件為某個(gè)框架中的文件。在Src（源）文本框中，可以設(shè)置該框架源文件的URL。也可以單擊右方的文件夾按鈕，從磁盤(pán)上選擇框架文件。另一種指定框架源的方法是首先在文檔窗口中單擊框架窗格，將插入點(diǎn)放入該窗格中，然后執(zhí)行inFrame（在框架中打開(kāi)）命令。3.滾動(dòng)條框架是一個(gè)有一定范圍的區(qū)域，如果其中的網(wǎng)頁(yè)較大，需用滾動(dòng)框架才能看到區(qū)域外的內(nèi)容。44第四十四頁(yè)，共七十五頁(yè)。Scroll（滾動(dòng)條）:下拉列表設(shè)置滾動(dòng)屬性。可以有四種選擇。Auto（自動(dòng)）：當(dāng)框架文檔內(nèi)容超出了框架的大小時(shí)，會(huì)出現(xiàn)框架滾動(dòng)條，允許通過(guò)拖動(dòng)滾動(dòng)條顯示框架內(nèi)容，內(nèi)容不超范圍則不顯示滾動(dòng)條。Yes（是）：無(wú)論框架文檔中的內(nèi)容是否超出框架的大小都會(huì)顯示框架滾動(dòng)條。No（不）：即使框架文檔中的內(nèi)容超出了框架的大小，也不會(huì)出現(xiàn)框架滾動(dòng)條。Default（默認(rèn)）：刪除scrolling（滾動(dòng)）屬性設(shè)置，大多數(shù)瀏覽器將之當(dāng)作Auto方式。4.框架大小簡(jiǎn)單調(diào)整框架大小的方法是拖動(dòng)文檔窗口框架的分隔條，另外可以在框架集屬性面板中調(diào)整整行框架的高度或整列框架的寬度。45第四十五頁(yè)，共七十五頁(yè)。4.框架大小簡(jiǎn)單調(diào)整框架大小的方法是拖動(dòng)文檔窗口框架的分隔條，另外可以在框架集屬性面板中調(diào)整整行框架的高度或整列框架的寬度。5.重設(shè)大小框架在設(shè)計(jì)階段可以通過(guò)拖動(dòng)邊框改變大小。在瀏覽器中，是否可以根據(jù)其中的顯示內(nèi)容改變大小呢？NoResize（不可重設(shè)大?。?fù)選框用來(lái)設(shè)置這一性質(zhì)。選中則在瀏覽器中不能通過(guò)拖動(dòng)框架的邊框來(lái)改變框架大小。而清除該復(fù)選框，則可以通過(guò)拖動(dòng)邊框來(lái)改變其大小。注意：這里設(shè)置的不可重設(shè)大小屬性指在瀏覽器中瀏覽網(wǎng)頁(yè)時(shí)的特性。在Dreamweaver的文檔窗口中，始終可以通過(guò)拖動(dòng)框架邊框來(lái)改變框架大??；46第四十六頁(yè)，共七十五頁(yè)。如在瀏覽器中改變大小，除不設(shè)NoResize項(xiàng)外，還必須設(shè)置框架集的邊框?qū)挾却笥?；框架是否可改變大小還與相鄰框架的設(shè)置有關(guān)，因?yàn)橐粋€(gè)框架如擴(kuò)大區(qū)域，相鄰框架就要縮小區(qū)域，所以，如果相鄰區(qū)域有一個(gè)設(shè)置為不能改變大小，則這個(gè)框架即使設(shè)置了可以改變大小不等，實(shí)際上也是改變不了的。6.邊框框架只是確定了窗口的分割結(jié)構(gòu)，但并不一定要在窗口中畫(huà)上分隔線。Borders（邊框）下拉列表設(shè)置是否顯示邊框。Yes：框架與其四周的框架相鄰處顯示分隔條。No：框架與其四周的框架相鄰處不顯示分隔條。Default：刪除Frameborder（框架邊框）屬性，大多數(shù)瀏覽器將之當(dāng)作Yes。47第四十七頁(yè)，共七十五頁(yè)。注意：該選項(xiàng)會(huì)覆蓋為框架集定義的邊框設(shè)置；只有在同當(dāng)前框架相鄰的所有框架的邊框都設(shè)置為不顯示時(shí)，框架間的邊框才會(huì)真正不顯示。BorderColor（邊框顏色）:顏色框設(shè)置框架邊框的顏色?？梢赃x擇顏色，也可以在文本框中輸入十六進(jìn)制顏色數(shù)值。該操作覆蓋對(duì)框架集中邊框顏色屬性的設(shè)置。MarginWidth（邊距寬度）:文本框設(shè)置當(dāng)前框架左右方的空白邊距，也即框架左右邊框同框架內(nèi)容之間的距離，單位是像素。MarginHeight（邊距高度）:文本框設(shè)置當(dāng)前框架上下方的空白邊距，也即框架上下邊框同框架內(nèi)容之間的距離，其單位是像素。48第四十八頁(yè)，共七十五頁(yè)。8.4.4設(shè)置框架集邊框框架集屬性包括框架的尺寸、顏色、框架之間邊框的寬度等?？蚣芗瘜傩钥梢杂伞翱蚣芗睂傩悦姘逶O(shè)置。選中框架集，“框架集”屬性面板如圖8.21所示。1.邊框在Borders（邊界）下拉列表中可設(shè)置框架集中所有框架的邊框是否被顯示。Yes，顯示該框架集中所有框架之間的分隔條；No，不顯示框架集中框架之間的分隔條；Default，刪除Frameborder（框架邊框）屬性。大多數(shù)瀏覽器將其當(dāng)作Yes。注意：對(duì)框架的屬性設(shè)置會(huì)覆蓋對(duì)框架集的屬性設(shè)置。49第四十九頁(yè)，共七十五頁(yè)。圖8.2150第五十頁(yè)，共七十五頁(yè)。例如，如果將某個(gè)框架集設(shè)置為無(wú)邊框，但是又將其中的某個(gè)框架屬性設(shè)置為有邊框，則在實(shí)際顯示中該框架將顯示邊框。BorderColor（邊框顏色）:顏色框設(shè)置框架集中所有框架邊框的顏色。BorderWidth（邊框?qū)挾龋?文本框設(shè)置框架集中所有框架的邊框?qū)挾?，單位是像素。注意：利用框架?duì)象按鈕創(chuàng)建框架集，所有的預(yù)定義框架集都帶有如下屬性，即沒(méi)有邊框、沒(méi)有滾動(dòng)條以及框架大小不可調(diào)節(jié)。2.框架大小除在文檔窗口中用鼠標(biāo)拖動(dòng)框架邊框外，還可以在框架集面板中改變框架大小。51第五十一頁(yè)，共七十五頁(yè)。①選中框架集。②單擊屬性面板右端“行/列選擇”中的相應(yīng)區(qū)域，選中要設(shè)置大小框架的行或列。單擊行頭或列頭可以選中相應(yīng)的框架行或框架列，單擊框架區(qū)域中任意位置，可以在選中該框架所在行或所在列兩種狀態(tài)之間切換。③在Value文本框中輸入框架的大小數(shù)值，在右方Unit（單位）下拉列表框中，可以選擇數(shù)值的單位。Pixels：表示在Value文本框中輸入的數(shù)值以像素作為單位。這種方式設(shè)置的框架大小是固定的，無(wú)論如何改變?yōu)g覽器窗口，框架的大小都保持不變。它經(jīng)常被應(yīng)用于一些永遠(yuǎn)不希望改變框架大小的場(chǎng)合中，如導(dǎo)航條所在的框架文檔。Percent：表示在Value文本框中輸入的數(shù)值是當(dāng)前框架同當(dāng)前框架集大小的百分比數(shù)值。這種方式設(shè)置的框架大小是不固定的，隨著瀏覽器窗口大小的變化，框架的大小也會(huì)發(fā)生變化。52第五十二頁(yè)，共七十五頁(yè)。Relative（相對(duì)）：表示在Value文本框中輸入的數(shù)值是當(dāng)前框架同其他框架之間的大小比例。注意：用Relative作度量單位，在框架集中應(yīng)有兩個(gè)以上框架使用該單位，才可以比較。如一個(gè)框架設(shè)置為3，一個(gè)框架設(shè)置值為9，則表示這兩個(gè)框架的大小比例為1∶3。8.4.5設(shè)置框架和框架集的標(biāo)題文檔的標(biāo)題指的是在文檔頭部位于<Title>和</Title>標(biāo)記之間的文字，它顯示在瀏覽器的標(biāo)題欄中。在插入了框架集文檔的窗口中，可以分別為每個(gè)框架文檔設(shè)置標(biāo)題，也可以為框架集文檔本身設(shè)置標(biāo)題。①如要設(shè)置框架文檔的標(biāo)題，可以將插入點(diǎn)放置到要設(shè)置標(biāo)題的框架窗格中；而要設(shè)置框架集標(biāo)題，則需要選中整個(gè)框架集。53第五十三頁(yè)，共七十五頁(yè)。②在工具欄Title（標(biāo)題）文本框中輸入或修改標(biāo)題?；驁?zhí)行Modify|PageProperties（頁(yè)面屬性）命令，打開(kāi)頁(yè)面設(shè)置對(duì)話框，設(shè)置標(biāo)題。注意：在瀏覽框架集文檔時(shí)，瀏覽器標(biāo)題欄上顯示的是框架集文檔的頁(yè)面標(biāo)題，盡管每個(gè)框架文檔都有其自己的標(biāo)題，但它們并不顯示在瀏覽器的標(biāo)題欄上，設(shè)置框架文檔的標(biāo)題主要是為了便于管理。當(dāng)然如果單獨(dú)瀏覽框架文檔，則瀏覽器標(biāo)題欄上仍會(huì)顯示框架文檔標(biāo)題；框架的標(biāo)題同框架的名稱(chēng)不同?？蚣軜?biāo)題是說(shuō)明框架文檔內(nèi)容的主題的，而框架名稱(chēng)僅僅是一個(gè)便于區(qū)別不同框架的符號(hào)。54第五十四頁(yè)，共七十五頁(yè)。8.5框架實(shí)例本節(jié)以一個(gè)實(shí)例介紹一下框架的綜合應(yīng)用?！纠?.5】框架的應(yīng)用實(shí)例設(shè)要建立一個(gè)“古典名著閱讀網(wǎng)”，如圖8.22所示，這是首頁(yè)。單擊某部書(shū)名，上部頁(yè)頭和底部的版權(quán)信息不動(dòng)，中間顯示該書(shū)主頁(yè)面，如單擊“紅樓夢(mèng)”，如圖8.23所示。頁(yè)面中部左邊顯示目錄，可以有滾動(dòng)條；右邊是一個(gè)象征性圖案。單擊目錄，在右邊顯示該回的內(nèi)容（見(jiàn)圖8.24）。其他書(shū)目相同，單擊首頁(yè)回到圖8.22所示的頁(yè)面。55第五十五頁(yè)，共七十五頁(yè)。圖8.2256第五十六頁(yè)，共七十五頁(yè)。圖8.2357第五十七頁(yè)，共七十五頁(yè)。圖8.2458第五十八頁(yè)，共七十五頁(yè)。下面僅以紅樓夢(mèng)為例介紹制作方法。（1）制作內(nèi)容頁(yè)面內(nèi)容頁(yè)面是普通頁(yè)面，每個(gè)章回做成一頁(yè)，不需做過(guò)多修飾，只要段落清楚即可，文件按章回編號(hào)，如hong001、hong002、hong003……，參見(jiàn)圖8.25。（2）制作圖書(shū)主頁(yè)，建立閱讀鏈接（見(jiàn)圖8.26）①在頁(yè)面中建左框架，設(shè)置框架屬性：顯示邊框、可重調(diào)大小、自動(dòng)加滾動(dòng)條、框架名稱(chēng)?？蚣苊麜r(shí)注意，有相互鏈接的所有頁(yè)面的框架最好不要重名，否則容易混亂，如可以設(shè)左右框架的名稱(chēng)分別為：bookml、bookmain。②在左邊輸入圖書(shū)目錄，右邊可以是象征性圖案和書(shū)名。③建立目錄與內(nèi)容的鏈接，特別注意鏈接的Target屬性設(shè)為bookmain。59第五十九頁(yè)，共七十五頁(yè)。圖8.2560第六十頁(yè)，共七十五頁(yè)。圖8.2661第六十一頁(yè)，共七十五頁(yè)。④保存框架集文件為hong.htm，左框架文件為hongleft.htm，右框架文件為hongright.htm。（3）制作主頁(yè)，建立圖書(shū)鏈接①在頁(yè)面上先建立一個(gè)上框架，再在下面的框架中建立一個(gè)下框架，形成一個(gè)上、中、下結(jié)構(gòu)的框架集，分別命名topframe、mainframe、bottomframe。以像素點(diǎn)為單位設(shè)置上、下框架的大小，設(shè)置不可重調(diào)大小，無(wú)滾動(dòng)條，中間框架自動(dòng)添加滾動(dòng)條。②在上面框架中插入一個(gè)兩行一列的表格。第一行輸入“古典名著閱讀網(wǎng)”并設(shè)置相應(yīng)的文字格式。第二行輸入“首頁(yè)三國(guó)演義紅樓夢(mèng)西游記水滸傳”，設(shè)置單元格背景為淡藍(lán)色。③在中間框架中插入一幅圖像，調(diào)整大小，不需特別設(shè)置。62第六十二頁(yè)，共七十五頁(yè)。④在下面的框架中輸入版權(quán)信息，不需特別格式化。⑤保存文件：框架集為gudian.htm，上框架為gudiana.htm，中框架為gudianb.htm，下框架為gudianc.htm。⑥建立鏈接。“首頁(yè)”鏈接gudianb.htm，target=″mainframe″；“紅樓夢(mèng)”鏈接hong.htm，target=″mainframe″……。⑦重新保存文件（SaveAllFrames）。⑧在Dreamweaver文檔窗口中按F12鍵，就可以欣賞作品了（見(jiàn)圖8.27）。注意：主頁(yè)文件名為gudian.htm。63第六十三頁(yè)，共七十五頁(yè)。圖8.2764第六十四頁(yè)，共七十五頁(yè)。8.6模板模板是網(wǎng)頁(yè)的樣板。利用模板可以制作格式相似的網(wǎng)頁(yè)?！纠?.6】創(chuàng)建模板①新建或打開(kāi)一個(gè)文檔，在其中編輯多個(gè)網(wǎng)頁(yè)中都需要的內(nèi)容?？梢允菆D像、表格、超鏈接、框架等任何網(wǎng)頁(yè)元素，編輯方法與一般網(wǎng)頁(yè)沒(méi)有任何不同。②執(zhí)行asTemplate（另存為模板）命令，將網(wǎng)頁(yè)保存為模板,這時(shí)會(huì)出現(xiàn)輸入模板名稱(chēng)的SaveAsTemplate對(duì)話框。注意：默認(rèn)狀態(tài)下，系統(tǒng)將默認(rèn)板文件保存在C:\\ProgramFiles\\Macromedia\\Dreamweaver4\\Lessons\\Lesson目錄下，可以在SaveAsTemplate對(duì)話框中選擇站點(diǎn)名稱(chēng)，則系統(tǒng)會(huì)將默認(rèn)板保存在站點(diǎn)目錄的Template子目錄中。65第六十五頁(yè)，共七十五頁(yè)。③設(shè)置完畢，按Save按鈕后，即將網(wǎng)頁(yè)存儲(chǔ)為模板。這時(shí)，模板名稱(chēng)會(huì)出現(xiàn)在模板（Template）面板（圖8.28）中。④設(shè)置可編輯區(qū)。可編輯區(qū)域是利用模板生成的新文檔中可以被編輯的區(qū)域，也即用于放置各文檔之間不同內(nèi)容的區(qū)域。應(yīng)用模板時(shí)，只可在可編輯區(qū)域中修改內(nèi)容。將插入點(diǎn)放到要設(shè)置可變區(qū)域的區(qū)域中，執(zhí)行Modify|Templates命令，再選擇NewEditableRegion（新建可編輯區(qū)域）菜單項(xiàng)，出現(xiàn)如圖8.29所示的NewE