Récemment, j'ai besoin d'utiliser fréquemment IFRAME pour dessiner des cadres hiérarchiques pour les pages pendant le travail de projet. La plupart des navigateurs n'ont pas d'arrière-plan, mais les iframes ont une couleur d'arrière-plan blanc par défaut dans IE. Lorsque la couleur d'arrière-plan principale n'est pas blanche, elle apparaîtra abrupte dans cette partie. La solution est donnée dans le manuel d'aide, c'est-à-dire définir la propriété ALLOTRANSPARET dans l'IFRAME TO TRUE, et vous pouvez le faire. Les exemples correspondants sont également donnés dans la documentation d'aide, comme suit:
Copier le code
Le code est le suivant:
<Body Style = "Background-Color: Red">
<Iframe id = "frame1" src = "transparentbody.htm" allowtransparency = "true">
</frame>
<Iframe id = "frame2" src = "transparentbody.htm" allowtransparency = "true"
Style = "fond-couleur: vert">
</frame>
<Iframe id = "frame3" src = "transparentbody.htm">
</frame>
<Iframe id = "frame4" src = "transparentbody.htm"
Style = "fond-couleur: vert">
</frame>
</docy>
En théorie, il n'y a aucun problème à le faire, mais IE ne semble pas avoir une grande réaction et a toujours un fond blanc. En fait, à ce stade, nous devons encore ajouter <corps bgcolor = "transparent"> à la balise <body> de la sous-page. L'exemple est le suivant:
http://img.blog.csdn.net/20140610165850968?watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqva3 VUCGVUZ19TDWJHBW == / FONT / 5A6L5L2T / FONTSIZE / 400 / FILL / I0JBQKFCMA == / Dissolve / 70 / Gravity / Center
Main.html Code de page principale:
Copier le code
Le code est le suivant:
<html>
<adal>
<Title> </Title>
</ head>
<Body Style = "Background-Color: Blue;">
<table
style = "largeur: 100%; bordure: 0; hauteur: 100%; Cellpadding: 0; portage de cellules: 0">
<tr height = "100%">
<td height = "100%" width = "30%">
<iframe id = "test1" src = "test1.html" allowtransparency = "true" width = "100%" height = "100%"> </ iframe> </td>
<td height = "100%" width = "40%">
<iframe id = "test2" src = "test2.html" allowtransparency = "true" width = "100%" height = "100%"> </ iframe> </td>
<td height = "100%" width = "30%">
<iframe id = "test3" src = "test3.html" width = "100%" height = "100%"> </ iframe> </td>
</tr>
</ table>
</docy>
</html>
Test1.html Code de page:
Copier le code
Le code est le suivant:
<html>
<adal>
<Title> </Title>
</ head>
<corps bgcolor = "transparent">
<h1> test1 </h1>
</docy>
</html>
Test2.html Code de page:
Copier le code
Le code est le suivant:
<html>
<adal>
<Title> </Title>
</ head>
<body>
<h1> test2 </h1>
</docy>
</html>
Test3.html Code de page:
Copier le code
Le code est le suivant:
<html>
<adal>
<Title> </Title>
</ head>
<body>
<h1> test3 </h1>
</docy>
</html>
Ce petit exemple est principalement l'application de la propriété ALLANDTRANSPARENCE de la balise IFRAME. Lorsque la propriété est définie sur true et que la couleur d'arrière-plan de la balise <body> de la sous-page chargée par l'IFRAME est définie sur transparente (transparente).
AllowTransparence définit ou obtient si l'objet peut être transparent.
BGCOLOR définit ou obtient la couleur d'arrière-plan de l'objet.