素材源碼參賽作品frame_第1頁(yè)
素材源碼參賽作品frame_第2頁(yè)
素材源碼參賽作品frame_第3頁(yè)
素材源碼參賽作品frame_第4頁(yè)
素材源碼參賽作品frame_第5頁(yè)
已閱讀5頁(yè),還剩72頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

第9章

框架的應(yīng)用9.1框架概述9.2框架的基本結(jié)構(gòu)9.3設(shè)置框架9.4設(shè)置框架集<frameset>9.5浮動(dòng)框架<iframe>9.6在框架上建立鏈接9.7小實(shí)例——框架的實(shí)際應(yīng)用9.8習(xí)題HTML/CSS/JavaScript

標(biāo)準(zhǔn)教程實(shí)例版(第4版)9.1框架概述

框架是一種在一個(gè)網(wǎng)頁(yè)中顯示多個(gè)網(wǎng)頁(yè)的技術(shù),通過(guò)超鏈接可以為框架之間建立內(nèi)容之間的聯(lián)系,從而實(shí)現(xiàn)頁(yè)面導(dǎo)航的功能??蚣艿淖饔弥饕窃谝粋€(gè)瀏覽器窗口顯示多個(gè)網(wǎng)頁(yè),每個(gè)區(qū)域顯示的網(wǎng)頁(yè)內(nèi)容也可以不同,它的這個(gè)特性在“廠”字型的網(wǎng)頁(yè)中使用極為廣泛。9.1框架概述

實(shí)例代碼9.2框架的基本結(jié)構(gòu)

基本語(yǔ)法:<html><head><title>框架的基本結(jié)構(gòu)<title></head><frameset><frame><frame>…</frameset></html>9.2框架的基本結(jié)構(gòu)

語(yǔ)法說(shuō)明:在網(wǎng)頁(yè)文件中,使用框架集的頁(yè)面的<body>標(biāo)記將被<frameset>標(biāo)記替代,然后再利用<frame>標(biāo)記去定義框架結(jié)構(gòu),常見(jiàn)的分割框架方式有:左右分割、上下分割、嵌套分割,后面的章節(jié)將會(huì)具體介紹。所謂嵌套分割是指在同一框架集中既有左右分割,又有上下分割,9.3設(shè)置框架

9.3.1設(shè)置框架源文件屬性——src9.3.2添加框架名稱——name9.3.3設(shè)置框架邊框——frameborder9.3.4顯示框架滾動(dòng)條——scrolling9.3.5調(diào)整框架尺寸——noresize9.3.6設(shè)置框架邊緣寬度與高度——marginwidth與marginheight9.3.7添加不支持框架標(biāo)記<noframe>9.3.1設(shè)置框架源文件屬性——src

基本語(yǔ)法<frameset><framesrc=”URL”><framesrc=”URL”>…</frameset>9.3.1設(shè)置框架源文件屬性——src

語(yǔ)法說(shuō)明在HTML文件中,src用于設(shè)置框架加載文件的路徑。文件的路徑可以是相對(duì)路徑也可以是絕對(duì)路徑。9.3.1設(shè)置框架源文件屬性——src

實(shí)例代碼9.3.1設(shè)置框架源文件屬性——src

網(wǎng)頁(yè)效果9.3.2添加框架名稱——name基本語(yǔ)法<frameset><framesrc=”URL”name=””><framesrc=”URL”name=””>…</frameset>9.3.2添加框架名稱——name語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的name屬性給框架添加名稱,不會(huì)影響框架的顯示效果。9.3.2添加框架名稱——name實(shí)例代碼9.3.2添加框架名稱——name網(wǎng)頁(yè)效果9.3.3設(shè)置框架邊框——frameborder基本語(yǔ)法<frameset><framesrc=”URL”frameborder=”value”><framesrc=”URL”frameborder=”value”>…</frameset>9.3.3設(shè)置框架邊框——frameborder語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的frameborder屬性設(shè)置框架顯示效果時(shí),只能設(shè)置框架的邊框是否顯示,frameborder值為0時(shí),不顯示邊框;frameborder值為1時(shí),顯示邊框。9.3.3設(shè)置框架邊框——frameborder實(shí)例代碼9.3.3設(shè)置框架邊框——frameborder網(wǎng)頁(yè)效果9.3.4顯示框架滾動(dòng)條——scrolling基本語(yǔ)法<frameset><framesrc=”URL”scrolling=”value”><framesrc=”URL”scrolling=”value”>…</frameset>9.3.4顯示框架滾動(dòng)條——scrolling語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的scrolling屬性有三種方式設(shè)置滾動(dòng)條:yes:添加滾動(dòng)條no:不添加滾動(dòng)條auto:自動(dòng)添加滾動(dòng)條9.3.4顯示框架滾動(dòng)條——scrolling實(shí)例代碼9.3.4顯示框架滾動(dòng)條——scrolling網(wǎng)頁(yè)效果9.3.5調(diào)整框架尺寸——noresize基本語(yǔ)法<frameset><framesrc=”URL”noresize><framesrc=”URL”>…</frameset>9.3.5調(diào)整框架尺寸——noresize語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的noresize屬性設(shè)置不允許改變左側(cè)框架的尺寸。9.3.5調(diào)整框架尺寸——noresize實(shí)例代碼9.3.5調(diào)整框架尺寸——noresize網(wǎng)頁(yè)效果9.3.6設(shè)置框架邊緣寬度與高度——marginwidth與marginheight基本語(yǔ)法9.3.6設(shè)置框架邊緣寬度與高度——marginwidth與marginheight語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的marginwidth和marginheight屬性設(shè)置不允許改變左側(cè)框架的尺寸。9.3.6設(shè)置框架邊緣寬度與高度——marginwidth與marginheight實(shí)例代碼9.3.6設(shè)置框架邊緣寬度與高度——marginwidth與marginheight網(wǎng)頁(yè)效果9.3.7添加不支持框架標(biāo)記<noframe>基本語(yǔ)法<framesrc=”URL”><framesrc=”URL”>。。。<noframes>…<noframes></frameset>9.3.7添加不支持框架標(biāo)記<noframe>語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的<noframes>屬性設(shè)置瀏覽器不支持框架時(shí),顯示網(wǎng)頁(yè)文件的內(nèi)容。9.3.7添加不支持框架標(biāo)記<noframe>實(shí)例代碼9.3.7添加不支持框架標(biāo)記<noframe>網(wǎng)頁(yè)效果9.4設(shè)置框架集<frameset>表9-1框架集屬性9.4設(shè)置框架集<frameset>9.4.1左右分割邊框——cols9.4.2上下分割邊框——rows9.4.1左右分割邊框——cols

基本語(yǔ)法<framesetcols="*,*"><framesrc=”URL”><framesrc=”URL”>…</frameset>9.4.1左右分割邊框——cols

語(yǔ)法說(shuō)明在HTML文件中,利用cols屬性將網(wǎng)頁(yè)進(jìn)行左右分割,分割方式可以是百分比,也可以是具體的數(shù)值。9.4.1左右分割邊框——cols

實(shí)例代碼9.4.1左右分割邊框——cols

網(wǎng)頁(yè)效果9.4.2上下分割邊框——rows

基本語(yǔ)法<framesetrows="*,*"><framesrc=”URL”><framesrc=”URL”>…</frameset>9.4.2上下分割邊框——rows

語(yǔ)法說(shuō)明在HTML文件中,利用rows屬性可以將網(wǎng)頁(yè)上下分割,分割方式與左右分割方式相同。9.4.2上下分割邊框——rows

實(shí)例代碼9.4.2上下分割邊框——rows

網(wǎng)頁(yè)效果9.4.2上下分割邊框——rows

網(wǎng)頁(yè)效果9.5浮動(dòng)框架<iframe>

表9-2浮動(dòng)框架屬性9.5浮動(dòng)框架<iframe>

9.5.1設(shè)置浮動(dòng)框架源文件屬性9.5.2添加浮動(dòng)框架名稱——name9.5.3設(shè)置浮動(dòng)框架的寬度和高度——width和height9.5.4設(shè)置浮動(dòng)框架的對(duì)齊方式——align9.5.1設(shè)置浮動(dòng)框架源文件屬性

基本語(yǔ)法<body><iframesrc="URL"width=""height=""></iframe></body>9.5.1設(shè)置浮動(dòng)框架源文件屬性

語(yǔ)法說(shuō)明在HTML文件中,src用于設(shè)置框架加載文件的路徑,文件的路徑可以是相對(duì)路徑也可以是絕對(duì)路徑。9.5.1設(shè)置浮動(dòng)框架源文件屬性

實(shí)例代碼9.5.1設(shè)置浮動(dòng)框架源文件屬性

網(wǎng)頁(yè)效果9.5.2添加浮動(dòng)框架名稱——name基本語(yǔ)法<body><iframesrc=”URL”name=””></iframe></body>9.5.2添加浮動(dòng)框架名稱——name語(yǔ)法說(shuō)明在HTML文件中,利用框架<frame>標(biāo)記中的name屬性給框架添加名稱,不會(huì)影響框架的顯示效果。9.5.2添加浮動(dòng)框架名稱——name實(shí)例代碼9.5.2添加浮動(dòng)框架名稱——name網(wǎng)頁(yè)效果9.5.3設(shè)置浮動(dòng)框架的寬度和高度——width和height基本語(yǔ)法<body><iframesrc=”URL”width=””height=“”></iframe></body>9.5.3設(shè)置浮動(dòng)框架的寬度和高度——width和height語(yǔ)法說(shuō)明在HTML文件中,<iframe>標(biāo)記中;width屬性可以設(shè)置浮動(dòng)框架寬度;

height屬性可以設(shè)定浮動(dòng)框架的高度。9.5.3設(shè)置浮動(dòng)框架的寬度和高度——width和height實(shí)例代碼9.5.3設(shè)置浮動(dòng)框架的寬度和高度——width和height網(wǎng)頁(yè)效果9.6在框架上建立鏈接9.6.1普通框架添加鏈接9.6.2浮動(dòng)框架添加鏈接9.6.1普通框架添加鏈接基本語(yǔ)法<framesetcols="380*,380*"><framesrc="left.html"><framesrc="right.html"name="right"></frameset>9.6.1普通框架添加鏈接語(yǔ)法說(shuō)明利用<frameset>標(biāo)記中的cols屬性進(jìn)行左右分割,左邊網(wǎng)頁(yè)文件來(lái)自于left.html,右邊網(wǎng)頁(yè)文件來(lái)自于right.html。9.6.1普通框架添加鏈接實(shí)例代碼9.6.1普通框架添加鏈接網(wǎng)頁(yè)效果9.6.1普通框架添加鏈接實(shí)例代碼9.6.1普通框架添加鏈接網(wǎng)頁(yè)效果9.6.2浮動(dòng)框架添加鏈接基本語(yǔ)法<iframesrc=""width="450"height="380"name="iframe"></iframe>9.6.2浮動(dòng)框架添加鏈接語(yǔ)法說(shuō)明定

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論