• ベストアンサー

CSSで背景画像を設定する

<html> <head> <title>--------</title> <style type="text/css"> body{background-image:url(image/-----.jpg)} </style> </head> ~~~ 画像を設定しましたが別のファイルではこの設定で表示できましたがこのファイルでは背景画像が設定できません。

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

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

  • ベストアンサー
noname#83877
noname#83877
回答No.1

bodyの中の内容によってはbodyの高さが小さすぎて見えないのではないでしょうか。 確認のためbodyにheight:1000px;のように指定をしてみてください。 記述ミスとして、}の後にセミコロンが抜けています。

4o3a6g6e
質問者

補足

申し訳ありません。 記載事項ができませんがとりあえずheight="1000px"を設定してみましたが何の変化もありません。bodyの高さが小さいという意味がわかりません。

その他の回答 (3)

  • goldfox
  • ベストアンサー率49% (123/249)
回答No.4

>背景などの画像ファイルは全部一括した場所に保存しているのでパスは間違っていないと思います。 実際に、確認された上での発言ですか? 背景が表示されないページに<img src="image/-----.jpg">と書いて背景画像が画像として表示されますか? ×印になりませんか? たったこれだけでパスがあっているかどうか、確実に確認できるのですから、「~と思います。」などと言っていないでやりましょう。

4o3a6g6e
質問者

補足

もちろんです。 いろんなサイトのCSSタグ表示を記述していきましたら、いろんな表示の方法があり、それぞれ記述していきました。 結局ピクセルの問題だったようです。

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.3

そのページのURL・・・たとえば file:///D:/homepage/test.html なら、         ^^^^^^^^^^を書き換えて file:///D:/homepage/image/-----.jpg で画像が表示されますか?  たぶん表示されない。なぜならパスが違うから・・・

4o3a6g6e
質問者

補足

背景などの画像ファイルは全部一括した場所に保存しているのでパスは間違っていないと思います。サイトから拾ったフリー素材ですが画像を保存している場所の指定記述でよいのであれば相対パスですよね?この方法で一つは指定できていますから。

noname#100277
noname#100277
回答No.2

記述方法としては正しいのですが、背景画像に指定した画像本体の縦横の大きさはどう成ってますか? 真逆body内に記述したコンテンツ自体の縦横の大きさを越えるサイズだったら反映はしないでしょう。 此の記述では「繰り返し、固定無し」と見做されてるからです。 </body><html>迄の記述内容が知りたいですね。 LINK先は割愛しても構いませんが。 ソレかHTMLを設定したディレクトリが「image/」を参照出来無いディレクトリに置いてる可能性も在ります。 パスの記述が間違ってる場合も在りますので、パスの参照先の変更で正常に表示するかも?

4o3a6g6e
質問者

補足

背景画像は200×154で画像の固定設定は行っていません。body内のコンテンツ自体の縦横の大きさというのはどこにあたるのか、わかりませんがPC内に表示できるサイズです。背景画像は非常に小さいものがたくさん連コマのように表示しています。コンテンツに使用している画像は携帯電話で撮影した200×400のものを使用して普通に表示しています。

関連するQ&A

  • css 背景の画像&文字のサイズ 同時に設定したい

    cssでbackground-imageで背景の画像を表示しつつ、 font-sizeを設定すると、どちらも反映されません。 どちらかだと反映されます。 2つを同時にしたい場合はどうすればいいでしょうか? どうやら <style type="text/css"> body{ background-image: url("image/backimage.jpg") font-size:50% } </style> だと、ダメなようです。

    • ベストアンサー
    • HTML
  • 背景を固定する。

    <HTML> <HEAD> <TITLE>・・・</TITLE> <STYLE TYPE="text/css"> <!-- BODY { background-image: url(画像のURL); background-repeat: no-repeat; background-position: right bottom; } --> </STYLE> </HEAD> <BODY> ・ ・ ・ </BODY> </HTML> このタグをいれても、背景が表示されず真っ白です。 何か間違ってるところがありますか?

  • HP作成で背景画像を設定する方法ですが、うまくいきません。

    HP作成で背景画像を設定する方法ですが、うまくいきません。 スタイルシートCSS等でいろいろサイトを見て試しましたが、 画像がどうしてもスクロールしてしまい、思ったように表示できません。 http://ravensky34.web.fc2.com/test.html HTMLタグでいくら設定しても画像が表示されないか、 ↑のように画像が必ずスクロールしてしまいます。 ソースは↓です。 <html> <head> <title>文書のタイトル</title> <style type="text/css"> body { background-color:#f0f0f0; background-image:url(http://ravensky34.web.fc2.com/2008_6_27_059syuku_2.jpg); background-attachment: fixed; color:#000000; }</style> </head> <body> <div>&nbsp;</div> <p>&nbsp;</p> </body> </html> どなたか解決方法を知っている方いましたら、教えて頂けると嬉しいです。

    • ベストアンサー
    • HTML
  • スタイルシートと、背景色の設定について

    画像を画面の中心に表示させようと、以下の様に設定したら、背景色が白になってしまうのです。 この場合どのようにすれば、背景を黒く設定できるのでしょうか? 画像の背景が黒なので困っています(涙 <head> <style type="text/css"> <!-- body{background:fixed url(***.gif) no-repeat 50% 50%} --> </style> </head> <BODY bgcolor="#000000"> 宜しくお願いします。。。

    • ベストアンサー
    • CSS
  • HTMLでの背景画像設定について

    はじめまして。 HP作成初心者なのですが、いろいろとネットで調べながら作成しています。 フレームを使っていて、メニュー画面側のほうに画像をふたつ使いたいと考えています。 それぞれ左上と左下とで固定する画像なのですが、それがどうしてもふたつ同時に表示できません。 <style type="text/css"> <!-- BODY {background-image : url("bg2.jpg");background-position: 100 0%; background-repeat: no-repeat;background-attachment: fixed;} --> </style> <style type="text/css"> <!--BODY {background-image : url("bg.jpg");background-position: 0 100%; background-repeat: no-repeat;background-attachment: fixed;} --> </style> という感じに記述しているのですが、こうすると、下にあるbg.jpgのみが反映されてしまって、bg2.jpgは反映されません。 また、bg2.jpgの上には文字を重ねたいと考えているのですが、そのようにタグを編集してもうまく表示できません。 ご回答よろしくお願いいたします。

  • 背景画像

    つい先日もこちらで教えていただいたのですが、また分からないのでよろしくお願いします。ビルダー11を使っています。 <style type="text/css"> <!-- body { margin:0px; padding:0px; text-align:center; } #main { margin-left:auto; margin-right:auto; text-align:left; width:650px; } --> </style> </head> <BODY background="080aosirobudou_300.jpg" style="background-repeat:no-repeat"> htmlで全体を真ん中にして、画像はリピートしないようにしていますが 画像の下半分が切れてしまいます。画像を小さくするしかないでしょうか?(加工OKなものを使っています)それと出来れば画像を右端によせたいのですが、上記htmlに <STYLE TYPE="text/css"> <!-- BODY{background-image:url(画像url); background-position:right} --> </STYLE> とすると、画像やスタイルがつぶれます。どうすればよいのでしょうか?ただいま勉強中のため、できましたら素人にも分かりやすく答えていただければありがたいです。よろしくお願いします。

  • 背景画像がNetscapeでは表示されない

    <HEAD>タグ内に下記の方法で背景画像を中央に表示させています。 IE5.5では正常に表示されますが、ネスケ4.7で確認すると背景画像のみ表示されません。 <BODY>タグ内の文字は正常に表示されます。 どうしたら良いでしょうか? <STYLE type="text/css"> <!-- table#base { background-image: url("img/bg.jpg"); background-repeat:no-repeat; background-position: center center; } --> </STYLE> 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 2つ画像を背景にするスタイルシートってある?

    1つの画像をスタイルシートで背景にするのは、知ってるんですが、2つの画像を同じページに背景にはできるのでしょうか?下記は1つの画像を背景にするスタイルシートです。これのどこかをいじれば可能なのでしょうか? <STYLE TYPE="text/css"> <!--    BODY {       background-image:素材のURL;       background-position:0% 100%;       background-repeat:no-repeat;       background-attachment:fixed;     } --> </STYLE>

    • 締切済み
    • CSS
  • styleの直接指定が効きません。

    外部ファイルにてbodyに背景画像を設定しているんですが、インラインフレームの中だけ背景色にしたく、 (1)<head>内に <Link rel="stylesheet" href="style.css" type="text/css"> <style type="text/css"> body { background-color: #fffff3; } </style> (2)<body style="background-color: #fffff3;">~</body> と両方試してみましたが、背景色が反映されず背景画像のままです。 外部ファイルの body { color : #57450f; background-image : url(image/back01.gif); } 背景画像の部分をはずすと背景色は反映されるんですが、何が問題なのでしょうか? 回答よろしくお願いします。

    • ベストアンサー
    • HTML
  • ホームページ作成

    背景を右下に設定する時は <style type="text/css"> <!-- body{ background-image: url(背景画像のURL); background-attachment: fixed; background-repeat: no-repeat; background-position: right bottom; } --> </style> を<head>から</head>までに書けばいいと書いてあったので <html> <head> <meta http-equiv="content-type" content="text/html; charset=EUC-JP"> <title>無題</title> <meta name="generator" content=" 6.0.0.49"> <style type="text/css"> <!-- body{ background-image: url(背景画像のURL); background-attachment: fixed; background-repeat: no-repeat; background-position: right bottom; } --> </style> </head> <body bgcolor="white" text="black" link="blue" vlink="purple" alink="red"> <p style="line-height:150%;">&nbsp;</p> </body> </html> と書きましたがダメでした。 どこが間違っていますか? またどうすれば直るか教えてください。 当たり前ですが、「画像URL」のところはちゃんとアドレスに置き換えました。

専門家に質問してみよう