創(chuàng)建和使用框架

1、第8章 創(chuàng)建和使用框架 重點(diǎn)內(nèi)容： 創(chuàng)建框架與框架集 選擇框架與框架集的方法 設(shè)置框架與框架的屬性 編輯框架頁面,一、 框架與框架集的概念 1.框架與框架集的用途 框架最常見的用途是導(dǎo)航。一組框架通常包括一個含有導(dǎo)航條的框架和另一個要顯示主要內(nèi)容頁面的框架。但是，框架的設(shè)計比較復(fù)雜；而且在很多情況下，可以不必創(chuàng)建框架就能達(dá)到相同的效果。例如，如果想讓導(dǎo)航條顯示在頁面的左側(cè)，則既可以用一組框架代替的頁面，也可以只是在站點(diǎn)中的每一頁上包含該導(dǎo)航條,一、 框架與框架集的概念 2.框架與框架集的工作方式 框架不是文件，它只是存放文檔的容器。其中的文檔并不是框架的一部分。使用框架最常見的情況是：一個框架

2、顯示包含導(dǎo)航控件的文檔，另一個框架顯示含有內(nèi)容的文檔?？蚣芗募旧聿话跒g覽器中顯示的HTML內(nèi)容，它只是向瀏覽器提供應(yīng)如何顯示一組框架，以及在這些框架中應(yīng)顯示哪些文檔的有關(guān)信息。在Dreamweaver中設(shè)計使用框架集的頁面時，必須保存所有文件，該頁面才能在瀏覽器中正常顯示,一、 框架與框架集的概念 3.使用框架集時應(yīng)執(zhí)行的常規(guī)步驟 （1）創(chuàng)建框架集并指定要在每個框架中顯示的文檔。 （2）保存將要在框架中顯示的每個文件。注意，由于每個框架都顯示單獨(dú)的HTML文檔，因此必須保存每個文檔以及該框架集文件。 （3）設(shè)置每個框架和每個框架集的屬性，如為各框架命名、設(shè)置滾動和不滾動選項等。 （4

3、）在屬性檢查器中為所有鏈接設(shè)置“目標(biāo)”屬性，以便鏈接目標(biāo)的內(nèi)容顯示在正確區(qū)域中,二、 創(chuàng)建框架與框架集 1.使用預(yù)定義創(chuàng)建框架集 將插入點(diǎn)置于文檔窗口中，然后單擊“布局”工具欄中的“框架”按鈕 右側(cè)的三角按鈕，從彈出的菜單中選擇所需的框架類型。“框架”菜單中提供了13種框架類型,二、 創(chuàng)建框架與框架集 2.自定義框架集 將鼠標(biāo)指針移至框架邊框上，當(dāng)鼠標(biāo)指針變?yōu)殡p向箭頭形狀時按下鼠標(biāo)左鍵向文檔窗口內(nèi)拖動，即可創(chuàng)建任意框架集,二、 創(chuàng)建框架與框架集 3.刪除框架 將指針指向此框架的邊框，當(dāng)指針形狀變?yōu)殡p向箭頭時拖動該邊框至文檔窗口邊框或其父框架的邊框上，即可刪除頁面上的框架。如果要刪除的框架中包含

4、尚未保存的文檔，Dreamweaver將提示用戶保存該文檔。通過拖動邊框的方式不能完全刪除框架集。要刪除框架集，可以通過關(guān)閉顯示它的文檔窗口來實現(xiàn)。如果該框架集文件已保存，可刪除該文件,二、 創(chuàng)建框架與框架集 4.創(chuàng)建嵌套框架集 將插入點(diǎn)置于要創(chuàng)建嵌套框架集的框架中，然后利用創(chuàng)建框架集的命令創(chuàng)建嵌套框架集,三、 選擇框架與框架集 1.在文檔窗口中選擇 在文檔窗口的設(shè)計視圖中，按住Alt鍵單擊框架內(nèi)部，即可選擇該框架。單擊框架集的某一內(nèi)部框架邊框則可選擇一個框架集。此外，執(zhí)行以下方法之一還可在選擇某個框架或框架集的基礎(chǔ)上選擇其他框架或框架集： （1）選擇與當(dāng)選所選內(nèi)容同一層次級別的下一框架（框架

5、集）或前一框架（框架集）：按住Alt鍵的同時按下左箭頭鍵或右箭頭鍵。 （2）選擇父框架集：按住Alt鍵的同時按上箭頭鍵。 （3）選擇當(dāng)前選擇框架集的第1個子框架或框架集：按 住Alt鍵的同時按下箭頭鍵,三、 選擇框架與框架集 2.在框架面板中選擇 在“框架”面板中單擊要選擇的框架或框架集的邊框，即可選中相應(yīng)元素。被選中的元素邊框以高亮顯示,四、 設(shè)置框架與框架集的屬性 1.設(shè)置框架屬性 選擇某個框架后，屬性檢查器中顯示該框架的相關(guān)屬性，用戶可在其中設(shè)置框架名稱、源文件、滾動條、邊框及邊框顏色等選項,四、 設(shè)置框架與框架集的屬性 2.設(shè)置框架集屬性 選擇某個框架集后，屬性檢查器中顯示該框架集的相

6、關(guān)屬性，用戶可在其中設(shè)置框架集的邊框、邊框顏色、邊框?qū)挾鹊葘傩?五、 編輯框架頁面 1.在框架中打開文檔 如果要在框架中插入新內(nèi)容，只須按照在普通頁面中添加內(nèi)容的方法來進(jìn)行操作即可。如果要在框架中打開已有的文檔，可將插入點(diǎn)放置在要插入內(nèi)容的框架中，然后選擇“文件”“在框架中打開”命令，打開“選擇HTML文件”對話框，選擇要打開的文檔，單擊“確定”按鈕，這時會打開一個提示對話框。若要使該文檔成為在瀏覽器中打開框架集時在框架中顯示的默認(rèn)文檔，應(yīng)單擊“是”按鈕保存該框架集,五、 編輯框架頁面 2.設(shè)置框架中文檔的背景 將插入點(diǎn)置于要設(shè)置背景的框架文檔中后，即可像在普通頁面一樣打開“頁面屬性”對話框，

7、設(shè)置當(dāng)前框架中文檔的背景顏色或背景圖像,五、 編輯框架頁面 3.控制框架內(nèi)容 在設(shè)計視圖中選擇要作為超鏈接的文本或?qū)ο?，然后在屬性檢查器中的“鏈接”文本框中指定要鏈接的文件，并在“目標(biāo)”下拉列表框中選擇鏈接的文檔應(yīng)在其中顯示的框架或窗口：“_blank”：用于在新的瀏覽器窗口中打開鏈接目標(biāo)文檔，同時保持當(dāng)前窗口不變：“_parent”：用于在顯示鏈接的框架的父框架集中打開鏈接的文檔，同時替換整個框架集；“_self”：用于在當(dāng)前框架中打開鏈接目標(biāo)，同時替換該框架中的內(nèi)容；“_top”：用于在當(dāng)前瀏覽器窗口中打開鏈接目標(biāo)文檔，同時替換所有框架,五、 編輯框架頁面 4.替換框架文件 將插入點(diǎn)置于要

8、替換的框架文件內(nèi)，然后選擇“文件”|“在框架中打開”命令，打開“選擇HTML文件”對話框，選擇要替換的文件后單擊“確定”按鈕。也可以在“框架”面板中選擇要替換的框架，并在屬性檢查器中的“源文件”文本框中輸入要替換成的文本路徑，或者單擊其右側(cè)的文件夾圖標(biāo)查找要替換的文件,五、 編輯框架頁面 5.保存框架和框架集文件 保存框架集文件：選擇框架集后選擇“文件”|“保存框架頁”命令，或選擇“文件”|“框架集另存為”命令，打開“另存為”對話框。在“文件名”文本框中輸入要保存框架集的名稱。 保存在框架中顯示的文檔：單擊文檔所在的框架，然后選擇“文件”|“保存框架”命令或選擇“文件”|“框架另存為”命令，打開“另存為”對話框。 保存與一組框架關(guān)聯(lián)的所有文件：可以選擇“文件”|“保存所有框架”命令,五、 編輯框架頁面 6.解決瀏覽器無法顯示框架的問題 選中框架集，然后選擇“修改”|“框架集”|“編輯無框架內(nèi)容”命令。此時Dreamweaver將清除文檔窗口，正文區(qū)域上方出現(xiàn)“無框架內(nèi)容”標(biāo)簽。當(dāng)訪問者使用不支持框架的瀏覽器訪問框架網(wǎng)頁時，看到的將是一個空白的頁面。用戶可以在這個空白的頁面中加入一段文字，提示訪問者使用的瀏覽器不支持框架，無法顯示框架及網(wǎng)頁的內(nèi)容,六、 思考 什么是框架和框架集？