背景画像の設定が反映されない問題について
- styleの直接指定が効かず、外部ファイルにて背景画像を設定している場合に、背景色を変える方法がわかりません。
- head内に<link>タグと<style>タグを使用して背景色を変える方法と、bodyタグに直接styleを指定する方法を試しましたが、いずれも背景色が反映されません。
- 背景画像の部分をはずすと背景色は反映されるため、背景画像の設定が問題の可能性があります。
- ベストアンサー
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); } 背景画像の部分をはずすと背景色は反映されるんですが、何が問題なのでしょうか？ 回答よろしくお願いします。
- hainaina
- お礼率65% (13/20)
- HTML
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
background-color と background-image の両方が指定されたことになるので、両方出ます。imageが上。 画像を無効にするのには、 background-color: #fffff3; background-image: url(); のように指定すればいいと思います。
その他の回答 (1)
- naokita
- ベストアンサー率57% (1008/1745)
何も問題無いですよ。 #fffff3の背景色があって、 その上に back01.gif があるので、#fffff3が見えないだけです。 body { color : #57450f; background :#fffff3 url(image/back01.gif) no-repeat; } としてみれば、すぐに理解出来るでしょう。 よく、bodyに background: #fffff3 url(image/back01.gif); とかの二重設定をしますが、 これは画像が表示されない場合の代替手段ともなります。
お礼
問題解決しました。 回答ありがとうございました！
補足
説明不足ようだったので、補足させていただきます。 背景画像はメイン画面の背景画像なので、外部ファイルで指定している background-image : url(image/back01.gif); を外さずに、インライン内で背景色を指定したいんです。 そこで背景色のhtmlをそのインラインのページのソースに直接指定して書いたんですが、背景色が反映されず、背景画像のままなんです。 外部ファイルの背景画像部分を外してみると、インラインの背景色が反映したりと、背景画像ありきだとうまくいきません。 不明瞭な質問ですみません。
関連するQ&A
- 背景色を指定したのに反映されません。
CSSは外部ファイルに記述しています。 画像のように色をつけたいのですが、うまくいきません。 上端から150pxです。テキスト・画像を表示しないで背景色のみの表示もできますでしょうか? ・HTML <body>間のみ ※<head>間に<link rel="stylesheet" href="sample.css" type="text/css">の記述はあります。 <body> <div class="color1"><p class>文字など（できれば入れない）</p></div> </body> ・CSS（sample.css） <style type="text/css"> div.color1 { width: 100%; height: 150px; color: black; background-color: blue; } </style> 同じ階層?に両ファイルはあります。
- ベストアンサー
- CSS
- <STYLE>シートでは指定できるんですけど・・
styleシートで画像の位置って指定できますよね？ 例えば、一番右下にぴったり画像をくっつけたい場合、 <STYLE type="text/css"> <!-- BODY { background-image:url(画像URL); background-repeat:no-repeat; background-position:right bottom;} --> </STYLE> で右下に画像が固定できますよね？ でも、<body>タグでは指定できないのでしょうか。 教えて下さい。
- 締切済み
- その他([技術者向] コンピューター)
- 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
- スタイルシートの記述について
例えば、文字を黒く、背景色を白くしたい場合ですが、どちらの記述が正しいですか？ (1)は兄が教えてくれたタグの書き方で、(2)はネットで見かけたタグ（CSSについて説明していたサイト）の書き方です。 カッコの違いが気になっています。 ネット検索をしたところ、(2)の形で書かれているほうが多かったです。 今は『<!-->』は、もう古かったりなどして使わない形なのでしょうか。 それとも(2)の『{}』のみの形はCSSとして使う場合なのでしょうか。 (1) <style type="text/css"> <!--P{color:#000000;}--> <!--BODY{background-color:#ffffff;} </style"> (2) <style type="text/css"> p{color: #000000;} body{background-color:#ffffff;} </style">
- ベストアンサー
- その他（インターネット・Webサービス）
- css 背景の画像＆文字のサイズ 同時に設定したい
cssでbackground-imageで背景の画像を表示しつつ、 font-sizeを設定すると、どちらも反映されません。 どちらかだと反映されます。 2つを同時にしたい場合はどうすればいいでしょうか？ どうやら <style type="text/css"> body{ background-image: url("image/backimage.jpg") font-size:50% } </style> だと、ダメなようです。
- ベストアンサー
- HTML
- スタイルシートについて
スタイルシートで背景を画像にするものがありますよね。 それでＨＰを作ったものの、その画像が見れる人と見れない人が出てきてしまって困っています。もちろんインターネットオプションのユーザー補助は確認しています。自分の記述が悪いかもしれないので書いておきます。 <STYLE TYPE="text/css"> <!-- BODY { background-image:url("c:/my documents/素材ファイル名"); background-position:50% 50%; background-repeat:no-repeat; background-attachment:fixed; } --> </STYLE>
- ベストアンサー
- その他（インターネット・Webサービス）
- テーブルにスタイルシートを使う方法
こんにちは、テーブルタグのことで質問があります。 普通、背景画像でスタイルシートを使い右下などに固定するタグは <STYLE TYPE="text/css"> <!-- BODY { background-image : url("画像の名前"); background-repeat : no-repeat; background-attachment : fixed; background-position : left bottom; background-color:#FFFFFF; } --> </STYLE> となると思いますが、これは通常<head></head>の間にいれますよね。 これをテーブルの中で使うにはどうすればいいでしょう？ テーブルの背景画像を右下や左下などに固定したいということなんですがそういうことはできますか？ よろしくお願いします；
- 締切済み
- HTML
- スタイルシートが反映されません。
本の通り、スタイルシートを記述しましたがIE5.5では背景が反映されず NN4.75ではHTMLの内容までも消えて、何も表示されません。 htmlファイルのすぐ上のimagesフォルダにbggreen.jpgを入れてあり、 ディレクトリは間違いないと思うのですが、何がおかしいのかわかりません。 よろしくお願い致します。 <TYPE="text/css"> <!-- body { background-image: url('images/bggreen.jpg'); background-repeat: repeat-y } --></STYLE>
- ベストアンサー
- HTML
- ｃｓｓの、一つ目の記述がHTML側に反映されません。
スタイルシートの超初心者です。 <style type="text/css"> body {background-color:#87cefa;} h1 {background-color:#ffddaa;} と記述すると、bodyの記述がHTMLの表示に反映されず、順番を入れ替えても、一つ目になった記述が反映されません。 <style type="text/css"> } body {background-color:#87cefa;} h1 {background-color:#ffddaa;} 試しに、上の様に「}」を挟んだら反映されたのですが、こんなのをダミーで入れているのは、とっても納得が行きません。どなたか、原因を教えて頂けないでしょうか？
- ベストアンサー
- HTML
- HP作成 スタイルシート
ビルダーを使ってHPを作成しています。そこで、ページの背景の上だけにgif画像を指定したくスタイルシートを追加してみたのですがうまくなりません。ビルダーのHTMLに追加しているのですが追加する場所を間違えているような気がします。ビルダーで背景色を#cc0000設定しています。 <TITLE></TITLE> <STYLE type="text/css"> <!-- BODY { background-image: url("image/gurad1.gif"); background-repeat: repeat-x } --> </STYLE> <LINK rel="stylesheet" href="image/table.css" type="text/css" id="_HPB_TABLE_CSS_ID_"> </HEAD> <BODY bgcolor="#cc0000" link="#ffffff" alink="#009900">
- 締切済み
- その他(ソフトウェア)
お礼
上手くいきました。 ありがとうございました！