- ベストアンサー
画像の中にインラインフレームを作りたい
大きな画像(例えば額縁の画像)の中に インラインフレームを作りたいのですが、 どうしたらできますか？
- puwapuwapu
- お礼率100% (2/2)
- HTML
- 回答数2
- ありがとう数6
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
背景画像を指定したブロックの中にiframeを配置します。 <div style="background-image:url('画像のURL');width:X1px;height:Y1px;position:relative;"> <iframe ～ style="position:absolute;top:X2px;left:Y2px;width:x3px;height:y3px;">～</iframe> </div> x1,y1 は画像の大きさ、 x2,y2 はiframeを配置する位置(画像の左上からの距離) x3,y3 はiframeの大きさ なお、iframeの背景は読み込んだページの背景になります。 これを、親ページの背景を透かせたい場合は次のように指定します。 <iframe ～ allowtransparency="true"> さらに、読み込ませるページの方でもbodyに指定をします。 <body style="background-color:transparent;">
その他の回答 (1)
- Fumi__
- ベストアンサー率53% (7/13)
なかなか文章では説明しづらいのですが、２つの方法があります。 １つは額縁の画像を、上下左右の４つに分解して、 上段がセル１つ、中段が横並びにセル３つ、下段がセル１つのテーブルをつくり、 上段と下段には額縁の上と下の画像を、 中段の右端と左端のセルに右と左の画像を入れます。 セルの背景でもいいです。 画像がぴったりくっつくように余白、線の太さはすべて０にしてください。 そして、中段の真ん中のセルにインラインフレームを入れればOKです。 もうひとつの方法は、画像は分解しないでセルひとつのテーブルの 背景に指定します。テーブルのサイズを指定する必要があるかもしれません。 そして、テーブルの中にインラインフレームを入れるのですが、 額縁の画像と被らないよう、テーブルの内側の余白を指定してください。 以上です。変な表現で想像できないかもしれません。イラストならうまく説明できるんですが…。 こんな小手先の方法ですみません。もっといい方法があればそちらを参考に。
お礼
目からウロコでした！ 柔軟に頭を働かせられれば 本当にいろんなことができるんですね。 とても参考になりました。 分かりやすい説明で、すごく助かりました。 ありがとうございました！！！！！！！
お礼
教えていただいたのをコピーして 簡単に作ることができました。 問題を解決できて、今はもうすっきりです！ ご丁寧な説明、本当にありがとうございました！！！！！！