HTML iframe和frameset的區(qū)別_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理

簡(jiǎn)介
1.<iframe> 標(biāo)簽:iframe 是個(gè)內(nèi)聯(lián)框架,是在頁(yè)面里生成個(gè)內(nèi)部框架。
2.<frameset> 標(biāo)簽:frameset定義一個(gè)框架集,包含多個(gè)子框架,每個(gè)框架都有獨(dú)立的文檔。
<iframe> 標(biāo)簽
iframe 是個(gè)內(nèi)聯(lián)框架,是在頁(yè)面里生成個(gè)內(nèi)部框架。
<iframe></iframe>
屬性
frameborder{int}:是否顯示框架的邊框;
src{URL}:指定一個(gè)資源(如網(wǎng)頁(yè)、圖片)的uri;
scrolling{boolean}:是否顯示框架的滾動(dòng)條;
width{int}:定義iframe的寬度;
height{int}:定義iframe的高度;
示例
<body> <h3>HTML標(biāo)簽演示</h3> <iframe src=1.1-ShowHtml.htm ></iframe> </body>
注意事項(xiàng)
在 "<iframe>我是內(nèi)容</iframe>" 內(nèi)添加內(nèi)容時(shí),在展示頁(yè)面不會(huì)顯示添加的內(nèi)容。所以還是使用src屬性指定一個(gè)頁(yè)面吧。
應(yīng)用場(chǎng)景
1) 版本升級(jí)頁(yè)面,版本日志過(guò)多,可以把升級(jí)的信息放到一個(gè)iframe里。
2) 富文本編輯框,如博客園的【新建隨筆】區(qū)域。
<frameset> 標(biāo)簽
frameset定義一個(gè)框架集,包含多個(gè)框架,每個(gè)框架都有獨(dú)立的文檔。
格式
<frameset > <frame src=a.htm /> <frame src=b.htm /> <noframes></noframes> </frameset>
子項(xiàng)說(shuō)明
<framesrc=a.htm /> :子框架 <noframes></noframes>:瀏覽器不支持此框架的時(shí),顯示的內(nèi)容。
屬性
frameset屬性:
rows:表示子框架按行的樣式布局()。以2個(gè)子框架為例:rows="30%,*" ,表示第一個(gè)框架占整個(gè)頁(yè)面30%的高度,第二個(gè)占剩下的; cols:表示子框架按列的樣式布局(
)。以2個(gè)子框架為例:cols="30%,*" ,表示第一個(gè)框架占整個(gè)頁(yè)面30%的長(zhǎng)度,第二個(gè)占剩下的; noresize="noresize" :表示不調(diào)整子框架的范圍。
frame屬性:
src:指向一個(gè)資源(如頁(yè)面、圖片等)的URI;
name:指定框架的名稱,以便進(jìn)行框架間的操作。
示例
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>frameset 演示</title> </head> <frameset rows="30%,*" noresize="noresize"> <frame src=DateGrid.htm name="frm1" /> <frame src=Dialog.htm name="frm2"/> <noframes></noframes> </frameset> </html>
注意事項(xiàng)
使用frameset標(biāo)簽時(shí),注意要去掉外層的<body></body>標(biāo)簽。
子框架間的操作
參照示例代碼,frm1更改frm2的子集指向的頁(yè)面:window.parent.frames["frm2"].location.href = 'b.htm'
應(yīng)用場(chǎng)景
1) 后臺(tái)頁(yè)面的管理,左邊顯示 菜單,右邊框架 顯示詳細(xì)頁(yè)面。
2) 功能菜單頁(yè)面,如bbs.csdn.net
小知識(shí)
瀏覽頁(yè)面中的框架時(shí),在框架頁(yè)面內(nèi) 點(diǎn)擊右鍵,會(huì)多出框架的信息。
以chrome為例:
相關(guān)文章
HTML圖片img標(biāo)簽_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了HTML圖片img標(biāo)簽的相關(guān)資料,需要的朋友可以參考下2017-06-21HTML中錨點(diǎn)的使用_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
什么是HTML錨點(diǎn),錨點(diǎn)應(yīng)該如何用?這篇文章主要為大家詳細(xì)介紹了HTML中錨點(diǎn)的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-21HTML中div和span比較_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了HTML中div和span比較,分別介紹了div和span的用法和比較,有興趣的可以了解一下2017-06-21什么是HTML_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
HTML是超文本標(biāo)記語(yǔ)言,是一種用來(lái)制作超文本文檔的簡(jiǎn)單標(biāo)記語(yǔ)言,本文詳細(xì)的介紹了html的發(fā)展和基本概念,有興趣的可以了解一下2017-06-21HTML數(shù)據(jù)提交post_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
HTTP/1.1 協(xié)議規(guī)定的 HTTP 請(qǐng)求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 這幾種。其中 POST 一般用來(lái)向服務(wù)端提交數(shù)據(jù),本文主要討論 POST 提交數(shù)據(jù)2017-06-21HTML超鏈接a標(biāo)簽_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
<a>是超鏈接標(biāo)簽,什么是超鏈接呢?這篇文章主要介紹了HTML超鏈接a標(biāo)簽的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-21HTML常用格式標(biāo)簽_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了HTML常用格式標(biāo)簽的相關(guān)資料,需要的朋友可以參考下2017-06-20HTML簡(jiǎn)介_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
什么是HTML?什么是超鏈接?這篇文章主要為大家詳細(xì)介紹了HTML的最基礎(chǔ)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-21HTML表格_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
在html中繪制表格使用table標(biāo)簽,tr表示行,td表示列,下面通過(guò)代碼實(shí)例給大家介紹HTML表格的相關(guān)知識(shí),感興趣的朋友一起看看吧2017-06-20HTML基本結(jié)構(gòu)_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
HTML是創(chuàng)建網(wǎng)頁(yè)的基礎(chǔ)語(yǔ)言,如果不了解HTML就談不上網(wǎng)頁(yè)設(shè)計(jì)。以下是關(guān)于HTML基本結(jié)構(gòu)入門知識(shí)的講解2017-06-20