Maison  >  Article  >  interface Web  >  Comment définir la transparence de l'arrière-plan iframe

Comment définir la transparence de l'arrière-plan iframe

高洛峰
高洛峰original
2016-12-24 16:55:101257parcourir

IE5.5 commence à prendre en charge la transparence du contenu des frames flottants. Si vous souhaitez définir un contenu transparent pour un cadre flottant, les conditions suivantes doivent être remplies.
1. L'attribut de balise allowTransparency utilisé avec les éléments iframe doit être défini sur true.
2. Dans le document source du contenu iframe, l'attribut de balise bgColor de l'élément background-color ou body doit être défini sur transparent

<iframe src="./ads_top_tian.html" allowtransparency="true" style="background-color=transparent" title="test" frameborder="0" width="470" height="308" scrolling="no"></iframe>

Bien sûr, le principe est que la couleur n'est pas définie. dans la page iframe.
Dans ce qui précède, nous avons principalement vu le code style="background-color=transparent" avec style Grâce aux quatre façons suivantes d'écrire IFRAME, je pense que vous devriez avoir une compréhension claire de la façon de le faire. obtenir l'effet de transparence de l'arrière-plan iframe :

<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>

Regardons maintenant un exemple
Cet exemple applique principalement l'attribut allowTransparency de l'objet iframe Lorsque cet attribut est défini sur true et la couleur d'arrière-plan de l'objet iframe. La page chargée par l'iframe est définie sur transparente, l'iframe sera transparente.
allowTransparency définit ou obtient si l'objet peut être transparent.
bgColor définit ou obtient la couleur d'arrière-plan de l'objet

Page parent

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>父页面</title>
</head>
<body bgcolor="#FF0000">
<iframe src="index.htm"  allowTransparency="true"></iframe>
</body>
</html>

Page enfant

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>子页面</title>
<style type="text/css">
body
{
    background-color: transparent; 
}
</style>
</head>
<body>
</body>
</html>



Pour plus d'articles sur la façon de définir la transparence de l'arrière-plan iframe, veuillez faire attention au site Web PHP chinois !


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn