版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
模塊8框架8.1框架簡介8.2浮動框架8.3案例：浮動框架實現(xiàn)選項卡式鏈接思考與練習(xí)題
8.1框架簡介
框架可以實現(xiàn)在同一個瀏覽器窗口中顯示不止一個頁面。通過框架結(jié)構(gòu)標(biāo)簽<frameset>定義如何劃分瀏覽器窗口，劃分出的子窗口為一個框架，由<frame>標(biāo)簽定義，每個框架中可以顯示一個獨(dú)立的頁面。
示例如下：
在這個示例中，設(shè)置了一個框架集，將瀏覽器窗口劃分成兩列，第一列占據(jù)瀏覽器窗口30%寬度，第二列占據(jù)瀏覽器窗口70%寬度。頁面page1.html置于第一個框架中，頁面page2.html置于第二個框架中。
由于HTML5已經(jīng)舍棄了<frameset>標(biāo)簽，所以本書不再詳細(xì)介紹，大家了解即可。
8.2浮動框架
浮動框架的語法格式如下：其中，src用來定義浮動框架內(nèi)顯示的頁面的地址。width和height分別用來定義浮動框架的寬與高。name用來定義浮動框架的名稱，可將超鏈接的target目標(biāo)指向它，實現(xiàn)鏈接頁面在浮動框架中顯示。
【例8-1】浮動框架的應(yīng)用。
上述代碼在瀏覽器中的預(yù)覽效果如圖8-1所示。
圖8-1浮動框架的應(yīng)用
8.3案例：浮動框架實現(xiàn)選項卡式鏈接
【案例描述】綜合應(yīng)用超鏈接和浮動框架實現(xiàn)選項卡式鏈接。案例源文件參考“模塊8案例”。【考核知識點(diǎn)】超鏈接的應(yīng)用、浮動框架的應(yīng)用?！揪毩?xí)目標(biāo)】(1)掌握浮動框架的應(yīng)用。(2)掌握超鏈接目標(biāo)的設(shè)置。
【案例源代碼】
【運(yùn)行結(jié)果】
源代碼在瀏覽器中的運(yùn)行結(jié)果如圖8-2所示。
圖8-2案例運(yùn)行結(jié)果
【案例分析】
案例頁面包括標(biāo)題、超鏈接、浮動框架及頁腳等。浮動框架的初始頁面為page1.html，名稱為ifr。當(dāng)點(diǎn)擊各教程網(wǎng)站鏈接時，相應(yīng)的網(wǎng)站頁面會顯示在浮動框架內(nèi)，這是通過超鏈接的target屬性設(shè)置的，將target屬性值設(shè)置為浮動框架的名稱ifr即可。案例效果圖是應(yīng)用了CSS樣式后的結(jié)果，需要將外部CSS樣式文件“style8.css”引入到HTML頁面中的<head>標(biāo)簽內(nèi)。
思考與練習(xí)題
一、選擇題1.在HTML中，通過()標(biāo)簽定義浮動框架。A.<frameset>
B.<frame>C.<iframe>
D.<form>2.()屬性用于定義浮動框架的名稱，可將超鏈接的target目標(biāo)指向它，實現(xiàn)鏈接頁面的浮動框架中顯示。A.src
B.widthC.height
D.name
二、填空題
1.HTML中定義浮動框架的標(biāo)簽是
。
2.有HTML代碼如下：
<ahref="page2.html"
>打開頁面二</a>
<iframesrc="page1.html"width="500px"height="300p
溫馨提示
- 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025中國大唐集團(tuán)限公司重慶分公司所屬石柱發(fā)電公司招聘46人高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025下半年江蘇省南通市事業(yè)單位考試招聘高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025下半年四川內(nèi)江市市中區(qū)部分事業(yè)單位招聘21人歷年高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025上海城建城市運(yùn)營（集團(tuán)）限公司招聘51人高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025上半年廣東省深圳市事業(yè)單位招聘1420人歷年高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025上半年四川自貢市沿灘區(qū)事業(yè)單位招聘工作人員67人歷年高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025上半年四川省瀘州市江陽區(qū)事業(yè)單位考試招聘125人高頻重點(diǎn)提升（共500題）附帶答案詳解
- 2025“才聚齊魯成就未來”山東南郊集團(tuán)投資限公司招聘2人高頻重點(diǎn)提升（共500題）附帶答案詳解
- 防護(hù)頭盔勞動防護(hù)用品管理細(xì)則
- 2024年電子設(shè)備租賃及售后服務(wù)合同范本2篇
- 內(nèi)科醫(yī)生如何與患者建立有效的溝通
- 植物生長與環(huán)境課程教案
- 歌廳消防安全管理制度
- 獨(dú)立基礎(chǔ)計算(帶公式)
- 基站電力維護(hù)管理制度
- 《雪地尋蹤》選擇題及答案
- 2023年NPI產(chǎn)品工程師年度總結(jié)及下年工作展望
- 中醫(yī)科工作總結(jié)及計劃
- 窗簾采購?fù)稑?biāo)方案（技術(shù)標(biāo)）
- 2023-2024年人教版三年級上冊數(shù)學(xué)期末應(yīng)用題專題訓(xùn)練
- 職業(yè)學(xué)校消防安全課件
評論
0/150
提交評論