HTML <iframe> 標籤
示例
內嵌框架的標記如下
<iframe src="https://w3schools.tw" title="W3Schools Free Online Web Tutorials"></iframe>
自己動手試一試 »
更多“自己嘗試”的例子見下文。
定義和用法
The <iframe> tag specifies an inline frame.
An inline frame is used to embed another document within the current HTML document.
提示: Use CSS to style the <iframe> (see example below).
提示: It is a good practice to always include a title attribute for the <iframe>. This is used by screen readers to read out what the content of the <iframe> is.
瀏覽器支援
| 元素 | |||||
|---|---|---|---|---|---|
| <iframe> | 是 | 是 | 是 | 是 | 是 |
屬性
| Attribute | 值 | 描述 |
|---|---|---|
| allow | Specifies a feature policy for the <iframe> | |
| allowfullscreen | true false |
Set to true if the <iframe> can activate fullscreen mode by calling the requestFullscreen() method |
| allowpaymentrequest | true false |
Set to true if a cross-origin <iframe> should be allowed to invoke the Payment Request API |
| height | 畫素 | Specifies the height of an <iframe>. Default height is 150 pixels |
| loading | eager lazy |
Specifies whether a browser should load an iframe immediately or to defer loading of iframes until some conditions are met |
| name | text | Specifies the name of an <iframe> |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url |
Specifies which referrer information to send when fetching the iframe |
| sandbox | allow-forms allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-top-navigation |
Enables an extra set of restrictions for the content in an <iframe> |
| src | URL | Specifies the address of the document to embed in the <iframe> |
| srcdoc | HTML_code | Specifies the HTML content of the page to show in the <iframe> |
| width | 畫素 | Specifies the width of an <iframe>. Default width is 300 pixels |
全域性屬性
The <iframe> tag also supports the Global Attributes in HTML.
事件屬性
The <iframe> tag also supports the Event Attributes in HTML.
更多示例
示例
Add and remove iframe borders (with CSS)
<iframe src="/default.asp" width="100%" height="300" style="border:1px solid black;">
</iframe>
<iframe src="/default.asp" width="100%" height="300" style="border:none;">
</iframe>
自己動手試一試 »
相關頁面
HTML tutorial: HTML Iframes
HTML DOM reference: IFrame Object
預設 CSS 設定
Most browsers will display the <iframe> element with the following default values
iframe:focus {
outline: none;
}
iframe[seamless] {
display: block;
}
