欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

iframe標簽用法詳解(屬性、透明、自適應(yīng)高度)

  發(fā)布時間：2014-10-01 13:20:39   作者：佚名   我要評論
iframe一般用來包含別的頁面，例如我們可以在我們自己的網(wǎng)站頁面加載別人網(wǎng)站的內(nèi)容，為了更好的效果，可能需要使iframe透明效果，那么就需要了解更多的iframe屬性，這里簡單的整理下，方便需要的朋友

1、iframe 定義和用法

iframe 元素會創(chuàng)建包含另外一個文檔的內(nèi)聯(lián)框架（即行內(nèi)框架）。

HTML 與 XHTML 之間的差異

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

提示和注釋：

提示：您可以把需要的文本放置在 <iframe> 和 </iframe> 之間，這樣就可以應(yīng)對無法理解 iframe 的瀏覽器。

iframe標簽是成對出現(xiàn)的,以<iframe>開始,</iframe>結(jié)束

iframe標簽內(nèi)的內(nèi)容可以做為瀏覽器不支持iframe標簽時顯示

屬性

屬性 值 描述 DTD
align
  • left
  • right
  • top
  • middle
  • bottom

不贊成使用。請使用樣式代替。

規(guī)定如何根據(jù)周圍的元素來對齊此框架。

 TF
frameborder
  • 1
  • 0
 規(guī)定是否顯示框架周圍的邊框。 TF
height
  • pixels
  • %
 規(guī)定 iframe 的高度。 TF
longdesc URL 規(guī)定一個頁面，該頁面包含了有關(guān) iframe 的較長描述。 TF
marginheight pixels 定義 iframe 的頂部和底部的邊距。 TF
marginwidth pixels 定義 iframe 的左側(cè)和右側(cè)的邊距。 TF
name frame_name 規(guī)定 iframe 的名稱。 TF
scrolling
  • yes
  • no
  • auto
 規(guī)定是否在 iframe 中顯示滾動條。 TF
src URL 規(guī)定在 iframe 中顯示的文檔的 URL。 TF
width
  • pixels
  • %
 定義 iframe 的寬度。 TF

示例


復制代碼
代碼如下:

<iframe src="http://www.dbjr.com.cn" width="200" height="500">
腳本之家使用了框架技術(shù)，但是您的瀏覽器不支持框架，請升級您的瀏覽器以便正常訪問腳本之家。
</iframe>

使用像素定義iframe框架大小

復制代碼
代碼如下:

<iframe src="http://www.baidu.com" width="20%" height="50%">
腳本之家使用了框架技術(shù)，但是您的瀏覽器不支持框架，請升級您的瀏覽器以便正常訪問腳本之家。
</iframe>

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

2、iframe 透明

在transparentBody.htm文件的<body>標簽中，我已經(jīng)加入了style="background-color=transparent" 通過以下四種IFRAME的寫法我想大概你對iframe背景透明效果的實現(xiàn)方法應(yīng)該會有個清晰的了解：


復制代碼
代碼如下:

<IFRAME ID="Frame1" SRC="transparentBody.htm" allowTransparency="true"></IFRAME>
<IFRAME ID="Frame2" SRC="transparentBody.htm" allowTransparency="true" STYLE="background-color: green"> </IFRAME>
<IFRAME ID="Frame3" SRC="transparentBody.htm"></IFRAME>
<IFRAME ID="Frame4" SRC="transparentBody.htm" STYLE="background-color: green"> </IFRAME>


iframe是迫不得已才使用的，因為使用iframe會帶來較多的問題，而有的瀏覽器可以設(shè)置將iframe當作廣告屏蔽。

在最近的一個工作內(nèi)容中使用了iframe，開始遇到的問題是iframe高度自適應(yīng)的問題，這問題在口碑網(wǎng)ued團隊博客中找到了解決辦法，后來更遇到一個iframe透明的問題

通常 iframe底色會是白色，在不同瀏覽器下可能會有不同的顏色

如果主頁面有一個整體的背景色或者背景圖片的時候

iframe區(qū)域便會出現(xiàn)一個白色塊，與主體頁面不協(xié)調(diào)，這就需要iframe透明

通過google搜索iframe透明找到了解決辦法

復制代碼
代碼如下:

<iframe src="./ads_top_tian.html" allowtransparency="true" style="background-color=transparent" title="test" frameborder="0" width="470" height="308" scrolling="no"></iframe>當然前提是iframe頁面中沒有設(shè)置顏色
[code]
注：iframe透明主要是使用了 allowtransparency="true" style="background-color=transparent"
<strong>3、iframe自適應(yīng)高度
</strong>由于篇幅過長，大家可以移步這里查看
<a target="_blank" href="http://www.dbjr.com.cn/article/15780.htm">http://www.dbjr.com.cn/article/15780.htm</a>
<strong>4、通過js輸出iframe廣告代碼
</strong>[code]
document.write('<iframe align=middle marginwidth=0 marginheight=0 src="http://img.jb51.net/imgby/468_1.htm" frameborder=no scrolling=no width=660 height=80></iframe>');


5、有時候我們需要考慮用戶的瀏覽器是否支持iframe標簽，那么就需要如下的寫法


復制代碼
代碼如下:

<iframe frameborder="0" name="Iframe1" src="http://www.dbjr.com.cn/" width="100%" height="200">
您的瀏覽器不支持嵌入式框架，或者當前配置為不顯示嵌入式框架。
</iframe>

相關(guān)文章

  • iframe如何刷新的三種實現(xiàn)方案

    iframe如何刷新一直都被網(wǎng)友所關(guān)注，接下來為大家詳細介紹下三種:用iframe的name屬性定位/id屬性定位/當iframe的src為其它網(wǎng)站地址時,感興趣的朋友可以參考下哈
    2013-03-29

  • iframe的src設(shè)置為about:blank之后細節(jié)探討

    不設(shè)置為about:blank，內(nèi)存不會釋放掉。還必須用 iframe.document.write(''); 這樣才能將內(nèi)容清空，本文將詳細探討一下iframe的src設(shè)置為about:blank之后細節(jié)，感興趣的你
    2013-02-25

  • iframe的src賦值問題(服務(wù)器端)

    frame的src賦值的問題，本文將進行詳細探討:服務(wù)器端的iframe重新src重新賦值,給iframe加一個ID，再加上runat=server，感興趣的你可不要錯過了哈
    2013-02-25

  • 網(wǎng)頁設(shè)計技巧:iframe自適應(yīng)高度的問題

    所謂iframe自適應(yīng)高度，就是，基于界面美觀和交互的考慮，隱藏了iframe的border和scrollbar，讓人看不出它是個iframe
    2012-11-12

  • 為什么要少用Iframe的幾個原因分析

    iframes 提供了一個簡單的方式把一個網(wǎng)站的內(nèi)容嵌入到另一個網(wǎng)站中。但我們需要慎重的使用iframe。iframe的創(chuàng)建比其它包括scripts和css的 DOM 元素的創(chuàng)建慢了 1-2 個數(shù)量級
    2012-09-05

  • 三談Iframe自適應(yīng)高度代碼

    在構(gòu)建B/S系統(tǒng)界面的時候，經(jīng)常會遇到主頁面index.html中嵌套其他頁面的情況 ，雖然已經(jīng)有的庫已經(jīng)提供了控件(例如jQuery easy UI),但是有時候iframe的使用是不可避免的
    2010-08-06

  • 讓iframe透明的參數(shù)

    有時候需要讓iframe繼承父頁面的顏色。不需要復雜的操作，簡單的幾個參數(shù)設(shè)置下即可。
    2010-07-21

  • IE6 select z-index無效，遮擋div bug的解決方法

    在最近的一個項目中，遇到了IE6 select遮擋div的bug，為了解決這個bug我查了很多資料，試圖找到一個最最有效的方法，很多人是通過iframe的方法來解決，其實我查了國外的很
    2010-06-18

  • Iframe 高度自適應(yīng)（兼容IE/Firefox、同域/跨域）

    在實際的項目進行中，很多地方可能由于歷史原因不得不去使用iframe，包括目前正火熱的應(yīng)用開發(fā)也是如此。
    2010-03-17

  • Iframe和FRAME的區(qū)別分析

    Iframe和FRAME的區(qū)別，方便大家以后在使用過程中根據(jù)實際需要取舍。
    2010-03-08

最新評論