HTML <iframe> 标籤

  • หน้าก่อนหน้า <i>
  • หน้าต่อไป <img>

Pagsasakop at paggamit

<iframe> Ang tag <iframe> ay nagtutukoy sa tagapagpaikot sa loob ng pahina (taga-ikot na loob ng pahina).

Ang tagapagpaikot sa loob ng pahina ay ginagamit upang i-embed ang isa pang dokumento sa kasalukuyang HTML na dokumento.

Mga tagubilin:Gamitin ang CSS upang itakda <iframe> ang estilo nito (tingnan ang mga halimbawa sa ibaba).

Mga tagubilin:Pinakamabuti na palaging magamit sa <iframe> May title attribute. Maaaring gamitin ng screen reader ang katangian na ito upang basahin ang tungkol sa <iframe> Paglalarawan ng nilalaman.

Mga pangkatiling bahagi:

Tuturuan ng HTML:HTML Iframe

Manwal ng HTML DOM:Objeto ng IFrame

Halimbawa

Mga halimbawa 1

Ang talaan ng tagapagpaikot sa loob ng pahina ay tulad nito:

<iframe src="https://www.codew3c.com" title="CodeW3C.com 在线教程"></iframe>

親自試試

範例 2

添加並刪除 iframe 的邊框(使用 CSS):

<iframe src="/index.asp" width="100%" height="300" style="border:1px solid black;">
</iframe>
<iframe src="/index.asp" width="100%" height="300" style="border:none;">
</iframe>

親自試試

屬性

屬性 描述
allow 規定 <iframe> 的功能策略。
allowfullscreen
  • true
  • false
如果 <iframe> 可以通過調用 requestFullscreen() 方法激活全屏模式,則設置為 true。
allowpaymentrequest
  • true
  • false
如果允許跨源 <iframe> 調用 Payment Request API,則設置為 true。
height 像素 規定 <iframe> 的高度。默認高度為 150 像素。
loading
  • eager
  • lazy
規定瀏覽器是應立即加載 iframe 還是推遲加載 iframe,直到滿足某些條件為止。
name 文本 規定 <iframe> 的名稱。
referrerpolicy
  • no-referrer
  • no-referrer-when-downgrade
  • origin
  • origin-when-cross-origin
  • same-origin
  • strict-origin-when-cross-origin
  • unsafe-url
規定在獲取 iframe 時要發送的參考信息。
sandbox
  • allow-forms
  • allow-pointer-lock
  • allow-popups
  • allow-same-origin
  • allow-scripts
  • allow-top-navigation
啟用一系列對 <iframe> 中內容的額外限制。
src URL 規定要嵌入到 <iframe> 中的文件的地址。
srcdoc HTML 碼 規定要在 <iframe> 中顯示的頁面的 HTML 內容。
width 像素 規定 <iframe> 的闊度。默認闊度為 300 像素。

全局属性

<iframe> ตามแบบภาพยังสนับสนุน คุณสมบัติโลกแบบ HTML

คุณสมบัติเหตุ

<iframe> ตามแบบภาพยังสนับสนุน คุณสมบัติเหตุใน HTML

การตั้งค่า CSS โรมัน

โปรแกรมเบราเซอร์ส่วนใหญ่จะใช้ค่าเริ่มต้นตามต่อไปนี้ <iframe> องค์ประกอบ:

iframe:focus {
  outline: none;
}
iframe[seamless] {
  display: block;
}

การสนับสนุนเบราเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน
  • หน้าก่อนหน้า <i>
  • หน้าต่อไป <img>