網(wǎng)頁制作標(biāo)準(zhǔn)教程

1、Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n框架的基本概念框架的基本概念n框架的創(chuàng)建、選中和保存框架的創(chuàng)建、選中和保存n設(shè)置框架和框架集的屬性設(shè)置框架和框架集的屬性n創(chuàng)建框架鏈接創(chuàng)建框架鏈接n瀏覽器不支持框架時(shí)的設(shè)置瀏覽器不支持框架時(shí)的設(shè)置Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n一個(gè)簡單的框架一個(gè)簡單

2、的框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例中包含三個(gè)框架，兩個(gè)框架集。實(shí)例中包含三個(gè)框架，兩個(gè)框架集。創(chuàng)建它的方法如下：創(chuàng)建它的方法如下： l單擊單擊“插入面板插入面板”中中“布局布局”選項(xiàng)按鈕選項(xiàng)按鈕 。l打開打開“框架框架”面板，選中面板，選中LeftFrame框架框架。 l選擇選擇“修改修改”“框架集框架集”“拆分上拆分上框架框架”命令。命令。 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例中包含三個(gè)框架，

3、兩個(gè)框架集。實(shí)例中包含三個(gè)框架，兩個(gè)框架集。創(chuàng)建它的方法如下：創(chuàng)建它的方法如下： （續(xù)）（續(xù)）l分別對三個(gè)框架文檔進(jìn)行編輯。分別對三個(gè)框架文檔進(jìn)行編輯。l選擇選擇“文件文件”“保存全部保存全部”命令，彈命令，彈出文件保存對話框，依次保存全部的框出文件保存對話框，依次保存全部的框架和框架集文檔。架和框架集文檔。 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n框架包含兩大部分：框架包含兩大部分： l框架集?？蚣芗?。 l單一框架。單一框架。 框架集子框架Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通

4、職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架插入預(yù)定義框架 lDreamweaver提供了提供了13種框架類型。種框架類型。 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)） l左側(cè)框架左側(cè)框架選擇選擇“插入插入”“Html”“框架框架”“左方左方”命令。命令。l右側(cè)框架右側(cè)框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)

5、）l頂部框架頂部框架l底部框架底部框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)）l下方和嵌套的左側(cè)框架下方和嵌套的左側(cè)框架 l下方和嵌套的右側(cè)框架下方和嵌套的右側(cè)框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)）l左側(cè)和嵌套的下方框架左側(cè)和嵌套的下方框架 l右側(cè)和嵌套的下方框架右側(cè)和嵌套的下方框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作

6、標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)）l上方和下方框架上方和下方框架 l左側(cè)和嵌套的頂部框架左側(cè)和嵌套的頂部框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）插入預(yù)定義框架（續(xù)）l右側(cè)和嵌套的上方框架右側(cè)和嵌套的上方框架 l頂部和嵌套的左側(cè)框架頂部和嵌套的左側(cè)框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n插入預(yù)定義框架（續(xù)）

7、插入預(yù)定義框架（續(xù)）l上方和嵌套的右側(cè)框架上方和嵌套的右側(cè)框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建框架集創(chuàng)建框架集l創(chuàng)建框架集的具體操作步驟如下：創(chuàng)建框架集的具體操作步驟如下：選擇選擇“查看查看”“可視化助理可視化助理”“框架邊框架邊框框” Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建框架集（續(xù)）創(chuàng)建框架集（續(xù)）l創(chuàng)建框架集的具體操作步驟如下：創(chuàng)建框架集的具體操作步驟如下： （續(xù)（續(xù)）選擇選擇“修改修改”“框架

8、集框架集”下的下的“拆分左側(cè)拆分左側(cè)框架框架”、“拆分右側(cè)框架拆分右側(cè)框架”、“拆分上框架拆分上框架”、“拆分下框架拆分下框架”，來創(chuàng)建框架集。其中，來創(chuàng)建框架集。其中：拆分左側(cè)框架拆分左側(cè)框架拆分右側(cè)框架拆分右側(cè)框架Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建框架集（續(xù)）創(chuàng)建框架集（續(xù)）l創(chuàng)建框架集的具體操作步驟如下：創(chuàng)建框架集的具體操作步驟如下： （續(xù)（續(xù)）選擇選擇“修改修改”“框架集框架集”下的下的“拆分左側(cè)拆分左側(cè)框架框架”、“拆分右側(cè)框架拆分右側(cè)框架”、“拆分上框架拆分上框架”、“拆分下框架拆分下

9、框架”，來創(chuàng)建框架集。其中，來創(chuàng)建框架集。其中： （續(xù)）（續(xù)）拆分上端框架拆分上端框架 拆分下端框架拆分下端框架 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建框架集（續(xù)）創(chuàng)建框架集（續(xù)）l創(chuàng)建框架集的具體操作步驟如下：創(chuàng)建框架集的具體操作步驟如下： （續(xù)（續(xù)）把鼠標(biāo)移動到邊框線上，鼠標(biāo)將變成雙箭頭把鼠標(biāo)移動到邊框線上，鼠標(biāo)將變成雙箭頭，按住鼠標(biāo)左鍵拖曳邊框線，按住鼠標(biāo)左鍵拖曳邊框線按住按住Alt鍵，按照上述方法用鼠標(biāo)拖動框架的鍵，按照上述方法用鼠標(biāo)拖動框架的邊框，包括新建的框架的邊框邊框，包括新建的框架的邊

10、框 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建框架集（續(xù)）創(chuàng)建框架集（續(xù)）l創(chuàng)建框架集的具體操作步驟如下：創(chuàng)建框架集的具體操作步驟如下： （續(xù)（續(xù)）如果對某個(gè)框架不滿意，需要?jiǎng)h除，可以按如果對某個(gè)框架不滿意，需要?jiǎng)h除，可以按住鼠標(biāo)左鍵，拖曳邊框到父框架邊框上住鼠標(biāo)左鍵，拖曳邊框到父框架邊框上 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建嵌入式框架集創(chuàng)建嵌入式框架集l創(chuàng)建嵌入式框架集的具體步驟如下：創(chuàng)建嵌入式框架集的具體

11、步驟如下：打開打開“框架框架”面板面板選擇選擇“修改修改”“框架集框架集”命令命令按住按住Alt鍵，用鼠標(biāo)拖曳邊框線鍵，用鼠標(biāo)拖曳邊框線 把鼠標(biāo)移動到邊框線上把鼠標(biāo)移動到邊框線上 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n創(chuàng)建嵌入式框架集（續(xù)）創(chuàng)建嵌入式框架集（續(xù)）l在在“框架框架”面板中可以看到嵌入的框架面板中可以看到嵌入的框架集。集。 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n選擇框架選擇框架 l選中框架選中框架在框架的

12、邊框上單擊即可選中框架。在框架的邊框上單擊即可選中框架。按住按住Alt鍵，單擊要選中的框架窗格中的任意位置。鍵，單擊要選中的框架窗格中的任意位置。從當(dāng)前框架移動到另一個(gè)同一級別的框架中，按住從當(dāng)前框架移動到另一個(gè)同一級別的框架中，按住Ctrl鍵，按下左右箭頭鍵。鍵，按下左右箭頭鍵。l選中框架集選中框架集 黑色實(shí)線包圍虛線包圍Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n保存框架保存框架l保存框架設(shè)置文件保存框架設(shè)置文件將框架文件保存為將框架文件保存為html文件。文件。在框架邊框上單擊鼠標(biāo)在框架邊框上單擊鼠標(biāo)選擇

13、選擇“文件文件”“保存框架保存框架”命令命令 l保存框架集的所有文件保存框架集的所有文件要保存框架集的所有文件，步驟如下：要保存框架集的所有文件，步驟如下： 選擇選擇“文件文件”“保存全部保存全部”命令命令確定要保存的框架文件名和保存類型確定要保存的框架文件名和保存類型單擊單擊“保存保存”按鈕按鈕 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n設(shè)置框架屬性設(shè)置框架屬性 l選中框架，打開選中框架，打開“屬性屬性”面板面板l框架名稱框架名稱 l源文件源文件 l滾動滾動 設(shè)置是否允許有滾動條。設(shè)置是否允許有滾動條。自動

14、自動是是 否否 默認(rèn)默認(rèn) Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n設(shè)置框架屬性（續(xù)）設(shè)置框架屬性（續(xù)）l邊框邊框是否需要邊框線，決定當(dāng)前框架的邊框是否是否需要邊框線，決定當(dāng)前框架的邊框是否被顯示。被顯示。是是 否否 默認(rèn)默認(rèn)l邊框顏色邊框顏色l不可調(diào)整大小不可調(diào)整大小 l邊界寬度邊界寬度l邊界高度邊界高度 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n設(shè)置框架集屬性設(shè)置框架集屬性l框架集的框架集的“屬性屬性”面板面板l邊框邊框

15、 是否顯示出邊框是否顯示出邊框是是 否否 默認(rèn)默認(rèn)l邊框顏色邊框顏色 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n設(shè)置框架集屬性（續(xù)）設(shè)置框架集屬性（續(xù)）l邊框?qū)挾冗吙驅(qū)挾萳行行/列列 “單位單位”選項(xiàng)是設(shè)置所填數(shù)值的單位選項(xiàng)是設(shè)置所填數(shù)值的單位像素單位像素單位百分比單位百分比單位 相對單位相對單位 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n設(shè)置框架鏈接設(shè)置框架鏈接 l在框架鏈接在框架鏈接“目標(biāo)目標(biāo)”下拉列表中可選擇下拉列表中

16、可選擇：_blank _self _parent _top Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例實(shí)例創(chuàng)建框架鏈接創(chuàng)建框架鏈接 l包含嵌入式框架的頁面包含嵌入式框架的頁面 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例實(shí)例創(chuàng)建框架鏈接（續(xù)）創(chuàng)建框架鏈接（續(xù)）l源文檔對應(yīng)的框架面板源文檔對應(yīng)的框架面板l鏈接到的目標(biāo)文檔鏈接到的目標(biāo)文檔home.htm Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職

17、業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例實(shí)例創(chuàng)建框架鏈接（續(xù)）創(chuàng)建框架鏈接（續(xù)）l創(chuàng)建的具體步驟如下：創(chuàng)建的具體步驟如下：選中選中“主體歌曲主體歌曲”文本，設(shè)置文本，設(shè)置“屬性面板屬性面板”。 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n實(shí)例實(shí)例創(chuàng)建框架鏈接（續(xù)）創(chuàng)建框架鏈接（續(xù)）l創(chuàng)建的具體步驟如下：創(chuàng)建的具體步驟如下： （續(xù)）（續(xù)）在在“目標(biāo)目標(biāo)”框中選擇框中選擇“_blank”選擇選擇“_self”選擇在自定義的框架中打開目標(biāo)文檔選擇在自定義的框架中打開目標(biāo)文檔 Dreamweav

18、er 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n特殊設(shè)置：瀏覽器不支持框架特殊設(shè)置：瀏覽器不支持框架l具體操作如下：具體操作如下：選擇選擇“修改修改”“框架集框架集”“編輯無框架編輯無框架內(nèi)容內(nèi)容”命令命令要退出要退出“無框架內(nèi)容無框架內(nèi)容”編輯狀態(tài)，再次選擇編輯狀態(tài)，再次選擇“修改修改”“框架集框架集”“編輯無框架內(nèi)容編輯無框架內(nèi)容”命令命令 Dreamweaver 網(wǎng)頁制作標(biāo)準(zhǔn)教程網(wǎng)頁制作標(biāo)準(zhǔn)教程 云南交通職業(yè)技術(shù)學(xué)院交通信息工程系云南交通職業(yè)技術(shù)學(xué)院交通信息工程系n1在框架頁的例子中的在框架頁的例子中的main1框架中不是框架中不是超級鏈接一個(gè)頁面，而是一幅超級鏈接一個(gè)頁面，而是一幅gif或或jpg的圖的圖像。像。n2標(biāo)題、欄目、內(nèi)容三框架頁面中，需要標(biāo)題、欄目、內(nèi)容三框架頁面中，需要在哪一框架中加入返回主頁的超級鏈接？在哪一框架中加入返回主頁的超級鏈接？在欄目、內(nèi)容框架的各子頁中需要加入返在欄目、內(nèi)容框架的各子頁中需要加入返回的超級鏈接嗎？回的超級鏈接嗎？n3從主頁超級鏈接到一個(gè)三框架頁面，返從主頁超級鏈接到一個(gè)三框架頁面，返回主頁時(shí)發(fā)現(xiàn)主頁在某一個(gè)框架中。原因回主頁時(shí)發(fā)現(xiàn)主頁在某一個(gè)框架中。原因是什么？如何解決？是什么？如何解決？n4除了小