サイト内検索
...HTML・XHTMLタグ...
インラインフレーム
背景を透明に
- 背景を透明にするには、iframe要素にallowtransparency属性を指定します。
- [使い方]
- <iframe src="sample.html" allowtransparency="true">
- インラインフレームに読み込まれるページのbody要素に、
- <body style="background-color: transparent;">
- ↑のようにスタイルシートで指定しておきます。
- [メモ・・・W3Cの検証サービス・・・]
- HTML 4.01 Strict ・ XHTML1.0 Strictでは推奨されていません。
属性 | 属性値 | 説明 |
---|---|---|
allowtransparency= | "true" | 背景を透過します。 |
"false" | 背景を透過しません。(標準値) |
サンプル
《メインページ(インラインフレームを指定するページ)》
[bodyの中]
<body background="img/img.gif" bgcolor="#ffffff" text="#000000" ><iframe src="inrain.html" width="300" height="150" allowtransparency="true">
サンプル
</iframe>
メインのページには背景画像を指定します。
</body>
《インラインフレームに読み込まれるページ(inrain.html)》
透過に対応しているブラウザでは、
インラインフレームの中にも背景画像が表示されます。
<head>
<title>インラインフレーム</title>
</head><body style="background-color: transparent;">
</body></html>
[ブラウザ上]
サンプルページは、こちら