• ベストアンサー

画像をHPの上下に表示させるには?

現在、HPを作成しています。 ページの上下左端それぞれに 動かない画像をピッタリと隙間無く表示させたいのですが、方法が分かりません。 さらに、これら2の画像の他に<body>タグの Backgroundで壁紙も指定したいのです。 左上だけにピッタリ画像を表示させる事は出来るのですが、 (ちなみに普通に画像を貼り付け、LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0"を指定しているだけです。) 左下に画像を表示させられません。 スタイルシートのbackground-imageを使用しようかと思ったのですが、 それだと<body>タグの Backgroundの指定が出来ないのです。 初心者過ぎる質問かもしれませんが どなたかご存知の方、教えてくださいませ~(T□T)

  • HTML
  • 回答数3
  • ありがとう数2

質問者が選んだベストアンサー

  • ベストアンサー
  • onimotsu
  • ベストアンサー率36% (279/758)
回答No.3

見る人(閲覧者)の画面表示サイズ(800×600とか)が異なるので難しいのですが できないこともないと思います。 しかし、javascriptと画面表示サイズに合わせたそれぞれHPを作成する必要があります。 考え方としては javascriptで閲覧者の画面表示サイズを判別して それに合わせたHPを呼び出します。 「javascriptで閲覧者の画面表示サイズを判別」は http://www.openspc2.org/reibun/javascript/window/009/index.html 閲覧者の使用環境によってはjavascriptが作動しないこともありますので 完璧に行うことは不可能だと思います。

ayako777
質問者

お礼

onimotsuさん、再回答ありがとうございます。 参考URLもありがとうございました! 拝見しました~。IEでは使用できないんですね。 やはり、どんな閲覧環境の方にも見ていただける方法はなさそうですね~(TT) 皆さんにお聞きして、フレームやJavaを使用しないで実行することは無理そうだということが分かりました。 ここで回答を締め切らせていただきたいと思います。 ありがとうございました!

その他の回答 (2)

  • moccos
  • ベストアンサー率43% (61/140)
回答No.2

初めまして。 「上下左端それぞれに 動かない画像をピッタリと隙間無く表示させたい」とおっしゃるのはブラウジングする環境で異なるので難しいのでは?画像のサイズの問題もありますし・・・ ”壁紙のように連続した画像を上下右に隙間無く”というのでしたらフレームで3分割すれば可能です。 では。

ayako777
質問者

お礼

moccosさんありがとうございます。 やはりフレームを使用する以外に、方法は無いのでしょうかね?(><) 検討してみます。 ありがとうございました!

  • onimotsu
  • ベストアンサー率36% (279/758)
回答No.1

<BODY topmargin="0" leftmargin="0" bottommargin="0" marginwidth="0" marginheight="0"> 「bottommargin="0"」で下の隙間をなくします。 背景は <BODY topmargin="0" leftmargin="0" bottommargin="0" marginwidth="0" marginheight="0" background="×××.JPG"> とか。 >左下に画像を表示させられません。 これ意味不明。 タグを明記すれば具体的に回答できると思います。

ayako777
質問者

補足

onimotsuさん回答ありがとうございます。 説明がヘタで申し訳ありませんー(><) 簡潔に言うと、2つの画像を指定配置し、さらに壁紙も指定したいのです。 2つの画像の置き場所は、ブラウザの「左上の角(端)」と「左下の角(端)」です。そこにピッタリと隙間なく指定し配置したいのです。 このようなことは、フレームを使用しないでできるのでしょうか? もしお分かりになるようでしたら、教えてくださいませ(><) よろしくお願いいたします。

関連するQ&A

  • 背景画像を入れた際のページのズレ(MacIE5)

    前々から気になっていたのですが、背景の画像を入れてページを制作する際、MacのIE5のみページが右下にずれたりしませんか?(毎回じゃないですが、結構な確立で) <body background="bg.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> こんな感じで普通にbodyタグで指定しているのですが・・・ その他のブラウザ(mac、win)だとOKなんですが、なぜでしょうか? ただ、同じタグで書いても、ずれないページもあるので、何が原因かわかりません。 対処として、フレームで区切ったり、スタイルシートで位置を指定したりが考えられると思うのですが、今回はなるべくプレーンなHTMLのみで解決が迫られています。 どうか、宜しくお願いいたします。

  • 任意の画像を左端と右端をぴったりくっつけるには横方向何ピクセル必要?

    こんにちは。 ページのトップ側に横方向の長い画像を とり込んで 左端と右端を ぴったりくっつけたいのですが 最低横方向は何ピクセル必要ですか??? (ピクセルが足りないと・・横方向に伸びた 画像になってしまいますし、 ピクセルが余ると・・横方向のスクロールバー が余計についてしまう!!) ・・もちろん<body>の属性に topmargin="0" leftmargin="0" marginwidth="0" marginheight="0" のタグお記述することはわかるのですが。。 下手な文章で申し訳ありません。

    • ベストアンサー
    • HTML
  • IEとスタイル

    <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> というタグがあります。 IE5,6,7にスタイルで対応させるには <style type=text/css>body{margin:0}</style></head><body> でよいですか?

    • ベストアンサー
    • HTML
  • 画面下にバーをいっぱいに表示する

    画面の上部については、余白なく <body topmargin=0 leftmargin=0 marginheight=0 marginwidth=0> で表示できたのですが、 以下のサイトのように http://www.aimix.jp/bodymag.html 画面一番下も色塗りバーでいっぱい表示する場合にはどのようにすれば宜しいのでしょうか?

    • ベストアンサー
    • HTML
  • HTMLをCSS

    ●<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> ●<table cellpadding="0" cellspacing="0"> 上記HTMLをCSSで設定するにはどういうソースになるのでしょうか? 教えて下さい。

    • ベストアンサー
    • HTML
  • ウェブページの表示位置についてお願いします。

    現在、ウェブサイトのコーディングをしているのですが、 ウェブブラウザ上(IE)での表示位置について困っています。 問題点は、 1.ウィンドウの上部分のマージン <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> の方法でを試してみたんですが、どうしても上手く行きません。 2.ウィンドウの表示位置 ページを開いたときに ページ本文の指定した範囲のみをウィンドウで表示したいのですが、 java scriptで可能でしょうか? 分かり辛い説明で申し訳ありません。。。 補足の画像を添えさせていただきます。 どうかご教示、よろしくお願いいたします。

  • 背景画像の折り返しをしたい

    背景画像を横に折り返したいのですが、下のタグを打つと、ドキュメントウインドウでは表示されるのですが、ブラウザで見ると何も表示されません。 画像の格納場所は、あっているはずですが、どこが間違っているのかわかりません。。。 dreamweaver MX、ブラウザはIE6.0を使用しています。 手打ちで行ったのですが、DREAMWEAVERの操作でできるのであれば、その方法も知りたいです。 お手数ですがどなた教えてください。よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>上のフレーム</title> <STYLE type="text/css"> <!-- BODY{ background-image:url(/img/top/line2.gif); background-repeat:repeat-x; } --> </STYLE> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> </body> </html>

  • フレームページの隙間

    フレームページを作ったのですが、フレームの間の隙間をなくしたのですがどのようになくすのか解りません。どうか教えて頂けないでしょうか。お願します。 実際のソースコート <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META name="GENERATOR" content="IBM HomePage Builder 2001 V5.0.0 for Windows"> <TITLE>もっくもっく</TITLE> </HEAD> <FRAMESET rows="155,*" frameborder="0" border="0" framespacing="0" framepadding="0"><!-- 上のフレーム --> <FRAME src="osawa1.html" name="1" scrolling="no" noresize topmargin="0" marginheight="0" leftmargin="0" marginwidth="0"> <FRAMESET cols="700,*" frameborder="0" border="0" framespacing="0" framepadding="0"><!-- 左のフレーム --> <FRAME src="osawa2.html" name="2" scrolling="auto" noresize mtopmargin="0" marginheight="0" leftmargin="0" marginwidth="0"> <!-- 右のフレーム --> <FRAME src="osawa3.html" name="3" scrolling="no" noresize topmargin="0" marginheight="0" leftmargin="0" marginwidth="0"> </FRAMESET> <NOFRAMES> <BODY topmargin="0" marginheight="0" leftmargin="0" marginwidth="0">フレーム対応ブラウザでご覧ください。</BODY> </NOFRAMES> </FRAMESET> </HTML>

  • FlashとHTMLファイルの境目がまだ見えるんです。

    FLASHのファイルをHTMLに張り込む際に、 タグ内に「topmargin=0 leftmargin=0 marginwidth=0 marginheight=0」 また、ムービーサイズには「width=100% height=100%」を入れると 枠なしのFLASHムービーがHTML上で表示されるということで そのように設定してみましたが、WinのIE5.5の環境では 左端にFLASHムービーが表示されてしまいました。 これを回避するにはどうしたらよいのでしょうか? 他の環境では正常に見える場合もあると思うのですが WinユーザーでIE5.5の環境の方は多いと思うので とっても困ってます。 全面表示がどうしても出来ない場合、それ以外で見栄えよくする 方法もあったら教えてください! お願いします。

    • ベストアンサー
    • HTML
  • 更新するとずれる?

    ホームページビルダー8でトップページを作成しました。 <body bgcolor="#ffffff" topmargin="0" leftmargin="0" marginwidth="0" marginheight="0"> の下にすぐ<table>をつくりその中にメニューアイコンをいくつか並べました。もちろん<tr><td>で区切っております。 さて、アップロードしきれいに仕上がったのですが、更新(リロード)すると中の画像が微妙ですが位置がずれるのです。これはなぜなんでしょうか? 以後更新してもそのままなのですが、再度URLをたたくとずれてます。・・・? 何か原因があるのでしょうか?だれか経験あるかたご教授おねがいします。

    • ベストアンサー
    • HTML

専門家に質問してみよう