推薦第五章,框架實(shí)現(xiàn)多窗口頁面

第五章

框架實(shí)現(xiàn)多窗口頁面網(wǎng)頁設(shè)計(jì)與制作技術(shù)框架框架和框架集設(shè)置框架頁中的鏈接框架實(shí)現(xiàn)多窗口頁面浮動(dòng)框架概述在網(wǎng)頁中除了使用表格和層進(jìn)行內(nèi)容的組織定位外,還有一種布局方式,那就是框架?？蚣苁蔷W(wǎng)頁的基本構(gòu)造,通過框架可實(shí)現(xiàn)多窗口頁面。框架通常用于布局論壇或網(wǎng)站后臺管理頁面等?？蚣芗褂每蚣芸梢园褳g覽器窗口劃分為若干個(gè)區(qū)域，每個(gè)區(qū)域就是一個(gè)框架。即在一個(gè)瀏覽器窗口分別顯示不同的HTML頁面。在框架網(wǎng)頁中同時(shí)還需要有一個(gè)文件記錄框架的數(shù)量、布局方式、鏈接和屬性等信息，這個(gè)文件就是框架集。

框架結(jié)構(gòu)的網(wǎng)頁單擊左側(cè)導(dǎo)航圖像，右邊窗口內(nèi)容發(fā)生變化左側(cè)窗口為固定內(nèi)容，不發(fā)生變化

用HTML代碼中創(chuàng)建框架網(wǎng)頁

<framesetrows="30%,*"><framesrc="first.html"><framesetcols="30%,*"><framesrc="second.html"><framesrc="third.html"></frameset></frameset>框架集<Frameset>屬性屬性描述Cols垂直切割窗口（左、右分割），設(shè)置框架的列寬及列數(shù)，參數(shù)單位：像素、百分?jǐn)?shù)。數(shù)值個(gè)數(shù)以逗號隔開。如：Cols=“40，＊，30%”，分割為三個(gè)窗口，第一部分寬40像素，＊號表示第一、第三窗口分割后剩下部分為中間窗口，第三部分占全部窗口寬的30%。Rows橫向切割窗口（上、下分割），設(shè)置框架的行高及行數(shù)，參數(shù)設(shè)定同上。Frameborder設(shè)定框架的邊框，值：0或1，0表示無邊框；1表示有邊框border設(shè)定邊框的寬度，以像素為單位。bordercolor設(shè)定邊框的顏色Framespacing框架與框架間保留的空白距離noframes定義不支持框架時(shí)顯示的內(nèi)容框架<Frame>屬性屬性描述name框架名稱src指明框架中HTML文件的文件名或超鏈接網(wǎng)址noresize設(shè)定框架大小不可改變scrolling設(shè)置框架中是否使用滾動(dòng)條。參數(shù)值：yes、no、Auto(由瀏覽器自行設(shè)置)marginheight設(shè)定框架內(nèi)文檔距上、下邊界的空白距離。單位：像素marginwidth設(shè)定框架內(nèi)文檔距左、右邊的界空白距離。單位：像素在Dreamweaver中創(chuàng)建框架頁

方法一：單擊【文件】菜單打開【新建文檔】對話框，在【常規(guī)】選項(xiàng)中選擇“框架集”

在Dreamweaver中創(chuàng)建框架頁方法二：在網(wǎng)頁編輯窗口單擊【布局】工具欄中的框架按鈕。自定義創(chuàng)建框架

【杳看】/【可視化助理】菜單下選擇“框架邊框”命令，框架頁的邊框就會(huì)顯示出來。將鼠標(biāo)放置在最上面的框架邊框上，鼠標(biāo)變成形狀后拖曳邊框到合適位置，將瀏覽器拆分為上下兩個(gè)窗口。按住【Alt】鍵將鼠標(biāo)放在要拆分的框架窗口內(nèi)單擊，鼠標(biāo)移至邊框上變成形狀拖曳，可繼續(xù)將框架進(jìn)行水平拆分為左右兩個(gè)窗口。方法三：自定義創(chuàng)建框架框架頁的選擇

單擊【窗口】/【框架】執(zhí)行菜單命令可打開【框架】面板。黑色粗線條圍起來的是框架集（Frameset）灰色線條圍起來的是(Frame)

設(shè)置框架的屬性

框架建立好后就可以在其【屬性面板】對框架的樣式進(jìn)行設(shè)置。如設(shè)置邊框及顏色，是否要滾動(dòng)條，框架窗口的大小等。

框架布局網(wǎng)頁

該網(wǎng)頁將瀏覽器窗口分割成三個(gè)部分：分別是上、左下、右下3個(gè)框架。這種框架稱為嵌套結(jié)構(gòu)框架指定框架頁的超鏈接為了確定超鏈接網(wǎng)頁在指定的目標(biāo)框架中顯示必須為框架命名

設(shè)置鏈接的目標(biāo)窗口

浮動(dòng)框架

浮動(dòng)框架是一種可以嵌入網(wǎng)頁的特殊框架。與一般框架不同，它不以框架集為基礎(chǔ)，可以插入到任何網(wǎng)頁中。屬性描述src文件的路徑，表示浮動(dòng)框的源文件width、height浮動(dòng)框架區(qū)域的寬與高Scrolling當(dāng)src指定的文件在區(qū)域內(nèi)顯示不完時(shí)，是否滾動(dòng)FrameBorder浮