HTML 框架
HTML框架
<iframe>
標簽規定一個內聯框架。
一個內聯框架被用來在當前 HTML 文檔中嵌入另一個文檔。
通過使用框架,你可以在同一個瀏覽器窗口中顯示不止一個頁面。
iframe 語法:
<iframe src="URL"></iframe>
該URL
指向不同的網頁,將窗口內容顯示為URL
地址指向頁面。
Iframe - 設置高度與寬度
height
和width
屬性用來定義iframe
標簽的高度與寬度。
屬性默認以像素為單位, 但是你可以指定其按比例顯示 (如:"80%").
實例
Iframe - 移除邊框
frameborder
屬性用于定義iframe
表示是否顯示邊框。
設置屬性值為 "0" 移除iframe
的邊框:
實例
使用 iframe 來顯示目錄鏈接頁面
iframe
可以顯示一個目標鏈接的頁面
目標鏈接的屬性必須使用iframe
的屬性,如下實例:
實例
<p><a href="http://www.w3cschool.cn" target="iframe_a">W3CSCHOOL.CN</a></p>
HTML iframe 標簽
標簽 | 說明 |
---|---|
<iframe> | 定義一個內聯的 iframe |
iframe 標準屬性
屬性 | 說明 |
---|---|
class | 規定元素的類名(classname) |
id | 規定元素的唯一 id |
style | 規定元素的行內樣式(inline style) |
title | 規定元素的額外信息(可在工具提示中顯示) |
HTML <frameset>標簽 -HTML5 不支持
<frameset>
標簽在一個頁面中設置一個或多個框架,用<frameset>
</frameset>
代替了<body>
</body>
,不能出現在body
標簽里。
<frameset> 語法:
<frameset>
<frame src="menu.html">
<frame src="content.html">
</frameset>
frameset
- 建立框架的標記,將在其中定義各個框架。frame src
- 指示框架顯示內容URL地址。
<frameset> - 設置行列比例
<frameset>
標簽中我們使用rows
設置行的占頁面的百分比;cols
設置列的所占百分比。
實例
<frameset rows="20%,*">
<frame src="title.html">
<frameset cols="30%,*">
<frame src="menu.html">
<frame src="content.html">
</frameset>
</frameset>
frameset cols
- 確定每個框架列所占百分比。在前面的示例中,我們已經確定第一框架將占據所示區域的 30%,并且我們使用“*”
符號來指示剩余百分比。frameset rows
- 確定將顯示的每個框架行所占百分比。在前面的示例中,我們選擇第一框架為 20%,剩下的剩余空間將在menu.html
和content.html
之間劃分。
<frameset> - 設置邊框
框架有一些邊框線,大多數時候都不需要。<frameset>
標簽中我們使用frameborder
和framespacing
屬性可以擦除它們。
注意:
frameset
和frameborder
是相同的屬性。
實例
<frameset border="0" frameborder="0" framespacing="0" rows="20%,*">
<frame src="title.html">
<frameset border="0" frameborder="0" framespacing="0" cols="30%,*">
<frame src="menu.html">
<frame src="content.html">
</frameset>
</frameset>
frameborder
-設置邊框, 0 值表示沒有邊框border
- 修改邊框的粗細(由 Netscape 瀏覽器使用)framespacing
- 修改邊框的粗細(由 Internet Explorer 瀏覽器使用)
<frame> - 設置名字 - HTML5 不支持
<frame>
標簽中我們使用name
屬性命名每個框架,而不是內容頁面。
實例
<frameset rows="20%,*">
<frame name="title" src="title.html">
<frameset cols="30%,*">
<frame name="menu" src="menu.html">
<name="content" src="content.html">
</frameset>
</frameset>
<frame> - 設置滾動
<frame>
標簽中我們使用noresize
設置禁止用戶拖拉框架大小;scrolling
用于設置滾動條是否顯示。
實例
<frameset border="2" frameborder="1" framespacing="2" rows="20%,*">
<frame src="title.html" noresize scrolling="no">
<frameset border="4" frameborder="1" framespacing="4" cols="30%,*">
<frame src="menu.html" scrolling="auto" noresize>
<frame src="content.html" scrolling="yes" noresize>
</frameset>
</frameset>
noresize
- 不允許用戶更改其尺寸。scrolling
- 設置滾動條是否顯示。