HTML iframe

2021-03-26 11:57 更新

HTML iframe

iframe 元素在現(xiàn)有元素中嵌入另一個(gè)HTML文檔。

它有局部屬性: src，srcdoc，name，width，height，sandbox，seamless 。

HTML5中的 sandbox 和seamless屬性是新增的。

longdesc，align，allowtransparency，frameborder，marginheight，marginwidth 和scrolling屬性已過(guò)時(shí)。

以下代碼顯示如何使用iframe元素。

<!DOCTYPE HTML>
<html>
<body>
  <a href="http://m.hgci.cn" target="myframe">Tutorial</a>
  <iframe name="myframe" width="300" height="300"> </iframe>
</body>
</html>

注意

將創(chuàng)建名稱屬性值為 myframe 的 iframe 。這將創(chuàng)建一個(gè)名為 myframe 的瀏覽上下文。

然后，這個(gè)瀏覽上下文在其他元素的目標(biāo)屬性中使用 - 特別是a，form，button，input和base。

a 元素來(lái)創(chuàng)建一對(duì)超鏈接，這些超鏈接會(huì)將其href屬性中指定的網(wǎng)址加載到iframe中。

width和height屬性指定大小(以像素為單位)。src屬性指定應(yīng)最初加載并顯示在iframe中的網(wǎng)址。

srcdoc屬性允許您定義一個(gè)內(nèi)嵌顯示的HTML文檔。

seamless屬性設(shè)置瀏覽器顯示iframe，如同它們是主HTML文檔的組成部分。

否則，默認(rèn)情況下會(huì)應(yīng)用邊框，如果內(nèi)容大于width和height屬性，則會(huì)出現(xiàn)滾動(dòng)條。


iframe sandbox

sandbox 屬性對(duì)HTML文檔應(yīng)用限制。當(dāng)應(yīng)用沒(méi)有值的屬性時(shí)，如下所示：

...
<iframe sandbox  name="myframe" width="300" height="100">
</iframe>
...

以下是禁用:

  • scripts
  • forms
  • plugins
  • 定位其他瀏覽上下文的鏈接

您可以通過(guò)為sandbox屬性定義值來(lái)啟用各個(gè)功能，如下所示：

...
<iframe sandbox="allow-forms" name="myframe" width="300" height="100">
</iframe>
...

可以使用的值的集合在下面的列表中描述。

  • allow-forms - 啟用表單
  • allow-scripts - 啟用腳本
  • allow-top-navigation - 允許定位到頂級(jí)瀏覽上下文的鏈接，這樣可以將整個(gè)文檔替換為另一個(gè)文檔，也可以創(chuàng)建新的標(biāo)簽頁(yè)或窗口
  • allow-same-origin - 允許將iframe中的內(nèi)容視為來(lái)自與文檔其余部分相同的位置
以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)