1. IFRAME Definition and usage
The IFRAME element creates an inline frame (inline frame) that contains another document.
The difference between HTML and XHTML
IFRAME elements are not supported in the HTML 4.1 Strict DTD and XHTML 1.0 Strict DTD.
Tips and Comments:
Tip: You can place the required text between <iframe> and </iframe> so that you can deal with browsers that don't understand the IFRAME.
IFRAME tags are paired and end with <iframe> start,</iframe>
Content within the IFRAME tag can be displayed when the browser does not support IFRAME tags
Property
Properties |
value |
Description |
DTD |
Align |
- Left
- Right
- Top
- Middle
- Bottom
|
Do not approve of use. Please use style instead. Specifies how this frame is aligned to the surrounding elements. |
Tf |
Frameborder |
|
Specifies whether the border around the frame is displayed. |
Tf |
Height |
|
Specifies the height of the iframe. |
Tf |
Longdesc |
Url |
Specifies a page that contains a longer description of the IFRAME. |
Tf |
Marginheight |
Pixels |
Defines the top and bottom margins of the IFRAME. |
Tf |
Marginwidth |
Pixels |
Defines the margins for the left and right sides of the IFRAME. |
Tf |
Name |
Frame_name |
Specifies the name of the IFRAME. |
Tf |
Scrolling |
|
Specifies whether scroll bars are displayed in the IFRAME. |
Tf |
Src |
Url |
Specifies the URL of the document to display in the IFRAME. |
Tf |
Width |
|
Defines the width of the IFRAME. |
Tf |
Example
Copy CodeThe code is as follows:
<iframe src= "http://www.jb51.net" width= "height=" >
The Scripting House uses frame technology, but your browser does not support frames, please upgrade your browser for normal access to the Scripting House.
</iframe>
Define the IFRAME frame size using pixels
Copy CodeThe code is as follows:
<iframe src= "http://www.baidu.com" width= "20%" height= "50%" >
The Scripting House uses frame technology, but your browser does not support frames, please upgrade your browser for normal access to the Scripting House.
</iframe>
Define the IFRAME frame size using percentages
2, IFrame Transparent
In the <body> tab of the transparentbody.htm file, I have joined style= "Background-color=transparent" Through the following four types of IFrame I think maybe your implementation of the IFRAME background transparency effect should have a clear understanding:
Copy CodeThe code is as follows:
<iframe id= "Frame1" src= "transparentbody.htm" allowtransparency= "true" ></IFRAME>
<iframe id= "Frame2" src= "transparentbody.htm" allowtransparency= "true" style= "</IFRAME>
<iframe id= "Frame3" src= "transparentbody.htm" ></IFRAME>
<iframe id= "Frame4" src= "transparentbody.htm" style= "</IFRAME>
An IFRAME is a necessity, because using an IFRAME can cause more problems, and some browsers may set the IFRAME as an ad mask.
In a recent work on the use of the IFRAME, the beginning of the problem is the IFRAME highly adaptive problem, this issue in the word of Mouth network ued Team Blog found a solution, and later encountered an IFRAME transparent problem
Usually the iframe background will be white and may have different colors under different browsers.
If the main page has an overall background color or background image,
A white block appears in the IFrame area and does not coordinate with the main page, which requires the IFRAME to be transparent
Find a solution through Google search iframe transparency
Copy CodeThe code is as follows:
<iframe src= "./ads_top_tian.html" allowtransparency= "true" style= "background-color=transparent" title= "test" Frameborder= "0" width= "470" height= "308" scrolling= "no" ></iframe> of course, if the color is not set in the IFRAME page
[Code]
Note: IFrame transparency is mainly used allowtransparency= "true" style= "Background-color=transparent"
<strong>3, iframe Adaptive height
</strong> because the space is too long, you can visit here
<a target= "_blank" href= "http://www.jb51.net/article/15780.htm" >http://www.jb51.net/article/15780.htm</ A>
<strong>4, via JS output iframe AD code
</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, sometimes we need to consider whether the user's browser supports IFRAME tags, then you need the following wording
Copy CodeThe code is as follows:
<iframe frameborder= "0" name= "Iframe1" src= "http://www.jb51.net/" width= "100%" height= ">"
Your browser does not support inline frames, or is currently configured to not display inline frames.
</iframe>
IFrame Label usage explained (attribute, transparent, adaptive height)