IE5.5 begins to support transparent content of floating frames. If you want to define transparent content for a floating frame, the following conditions must be met.
1. The Allowtransparency Label property used with the IFRAME element must be set to true.
2. In the iframe content source document, the bgcolor label property of the Background-color or BODY element must be set to transparent
Copy Code code 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, the premise is that there is no color set in the IFRAME page.
In the above we mainly see the style of a code style= "Background-color=transparent" through the following four kinds of iframe writing I think maybe you should have a clear understanding of the implementation of the IFRAME background transparency effect:
Copy Code code as follows:
<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>
Now let's look at an example
This example is primarily an Allowtransparency property application of an IFrame object that is transparent when the property is set to True and the background color of the page on the IFRAME is set to transparent (transparent).
Allowtransparency Sets or gets whether the object can be transparent.
bgcolor Sets or gets the background color of an object
Parent page
Copy Code code as follows:
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 ">
<title> Parent Page </title>
<body bgcolor= "#FF0000" >
<iframe src= "index.htm" allowtransparency= "true" ></iframe>
</body>
Child pages
Copy Code code as follows:
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 ">
<title> Sub-page </title>
<style type= "Text/css" >
Body
{
Background-color:transparent;
}
</style>
<body>
</body>
