ホームページ >ウェブフロントエンド >jsチュートリアル >iframeの背景の透明度を設定する方法
iframeの背景の透明度を設定する方法
- 高洛峰オリジナル
- 2016-12-24 16:55:101288ブラウズ
IE5.5 は、フローティング フレームのコンテンツの透明性のサポートを開始します。フローティング フレームに透明なコンテンツを定義する場合は、次の条件を満たす必要があります。
1. iframe 要素で使用されるallowTransparencyタグ属性はtrueに設定する必要があります。
2. iframeコンテンツのソースドキュメントでは、background-colorまたはbody要素のbgColorタグ属性をtransparentに設定する必要があります
<iframe src="./ads_top_tian.html" allowtransparency="true" style="background-color=transparent" title="test" frameborder="0" width="470" height="308" scrolling="no"></iframe>
もちろん、iframeページに色が設定されていないことが前提です。上記では、主に style ="background-color=transparent" のコード スタイルを示しています。次の 4 つの IFRAME 記述方法を通じて、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>それでは、見てみましょう。例を見てください
この例は主に iframe です。この属性が true に設定され、iframe によって読み込まれるページの背景色が透明に設定されている場合、iframe は透明になります。
allowTransparency は、オブジェクトを透明にできるかどうかを設定または取得します。
bgColor はオブジェクトの背景色を設定または取得します
<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>子ページ
<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>
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。