iframe標籤用法詳解(屬性、透明、自適應高度)_HTML/Xhtml_網頁製作

1、iframe 定義與用法

iframe 元素會建立包含另外一個文件的內嵌框架（即行內框架）。

HTML 與 XHTML 之間的差異

在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中，不支援 iframe 元素。

提示與註解：

提示：您可以把需要的文字放置在 之間，這樣就可以應付無法理解iframe的瀏覽器。

iframe標籤是成對出現的,以結束

iframe標籤內的內容可以做為瀏覽器不支援iframe標籤時顯示

屬性

屬性

值

描述

DTD

align

• left
• right
• top
• middle
• bottom

属性	值	描述	DTD
align	left right top middle bottom	不赞成使用。请使用样式代替。 规定如何根据周围的元素来对齐此框架。	TF
frameborder	1 0	规定是否显示框架周围的边框。	TF
height	pixels %	规定 iframe 的高度。	TF
longdesc	URL	规定一个页面，该页面包含了有关 iframe 的较长描述。	TF
marginheight	pixels	定义 iframe 的顶部和底部的边距。	TF
marginwidth	pixels	定义 iframe 的左侧和右侧的边距。	TF
name	frame_name	规定 iframe 的名称。	TF
scrolling	yes no auto	规定是否在 iframe 中显示滚动条。	TF
src	URL	规定在 iframe 中显示的文档的 URL。	TF
width	pixels %	定义 iframe 的宽度。	TF

不贊成使用。 請使用樣式代替。 規定如何根據周圍的元素來對齊此框架。

TF

frameborder

• 1
• 0

規定是否顯示框架周圍的邊框。

TF

height

• pixels
• %

規定 iframe 的高度。

TF

longdesc

URL

規定一個頁面，該頁麵包含了有關 iframe 的較長描述。

TF

marginheight

pixels

定義 iframe 的頂部和底部的邊距。

TF

marginwidth

pixels

定義 iframe 的左側和右側的邊距。

TF

name

frame_name

規定 iframe 的名稱。

TF

scrolling

• yes
• no
• auto

規定是否在 iframe 中顯示捲軸。

TF

src

URL

規定在 iframe 中顯示的文檔的 URL。

TF

width

• pixels
• %

定義 iframe 的寬度。

TF

範例

複製程式碼

複製程式碼

複製碼>

腳本之家使用了框架技術，但是您的瀏覽器不支援框架，請升級您的瀏覽器以便正常存取腳本之家。

使用像素定義iframe框架大小

複製程式碼

複製程式碼

複製程式碼


複製程式碼


複製程式碼

複製程式碼

複製碼>程式碼如下:

使用百分比定義iframe框架大小


2、iframe 透明


在transparentBody.htm檔案的標籤中，我已經加入了style="background-color=transparent" 透過以下四種IFRAME的寫法我想大概你對iframe背景透明效果的實現方法應該會有個清晰的了解：






複製程式碼

程式碼如下:

當然前提是iframe頁面中沒有設定顏色
[code]
註：iframe透明主要是使用了allowtransparency="true" style="background-color=transparent"
3、iframe自適應高度
由於篇幅過長，大家可以移步這裡看