• ベストアンサー

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

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

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

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

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

HTMLにしろCSSにしろ、最初は仕様書に目を通してから始めると良いです。  ⇒4.1.7 規則集合、宣言ブロック、セレクタ( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/syndata.html#rule-sets )  宣言ブロックは、左波括弧({)で始まり、対応する右波括弧(})で終わる。宣言の間には、ゼロ個以上のセミコロン(;)で区切られたリストが存在しなければならない。  ⇒4.1.8 宣言とプロパティ( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/syndata.html#declaration )  宣言は、空であるか、もしくはプロパティ名の後にコロン(:)続くでプロパティ値で構成される。これらの前後に空白が出現してよい。 宣言を続けるときは必ず;セミコロンで区切ること!!

vyrwansrbemj
質問者

お礼

ありがとうございました。

その他の回答 (1)

  • dezimac
  • ベストアンサー率56% (2365/4208)
回答No.1

文末の「;」を忘れています 改行していてもそれで一つの指定の終わりだと認識しないです。 body{ background-image: url("image/backimage.jpg"); font-size:50%; } このように一つの指定の後には必ず「;」を付けて下さい。 逆に「;」を付けていれば改行無しの1行で表記しても構いません。読みにくいけど。 body{background-image: url("image/backimage.jpg");font-size:50%;}

vyrwansrbemj
質問者

お礼

ありがとうございました。

関連するQ&A

  • CSSで背景画像を設定する

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

    • ベストアンサー
    • HTML
  • 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の上には文字を重ねたいと考えているのですが、そのようにタグを編集してもうまく表示できません。 ご回答よろしくお願いいたします。

  • 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
  • ieでだけ背景画像が表示されません

    internet explorerのすべてのバージョンにおいて、背景画像が反映されません。firefoxやopera、safariでは問題なく反映されます。 HTML: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=Shift_JIS"> <link rel="stylesheet" type="text/css" href="css.css"> </head> <body background="haikei.jpg"> てすと </body> </html> CSS: body {font-family:"MS Pゴシック";background-image:url(haikei.jpg);background-repeat:repeat;} なにが問題なのかわかる方、教えてください。よろしくお願いします。

  • 背景画像

    つい先日もこちらで教えていただいたのですが、また分からないのでよろしくお願いします。ビルダー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> とすると、画像やスタイルがつぶれます。どうすればよいのでしょうか?ただいま勉強中のため、できましたら素人にも分かりやすく答えていただければありがたいです。よろしくお願いします。

  • 背景画像がテーブルに透けてしまう

    <body background="画像のURL"> <STYLE TYPE="text/css"> <!-- BODY { background-color: white} --> </STYLE> <Table Border="1" Width="サイズ"> <Tr> <Td ColSpan="サイズ" Align="位置">~ という感じでページを作っているのですが、 背景の画像が透けてテーブルの中の文字が見え難く 困っています。 テーブルの中は「white」で白に指定している つもりなのですが、白になりません。。 このタグでテーブルの中を背景が反映されず真っ 白にする方法ってあるのでしょうか? 調べてみたのですがどうも分からないので教えて下さい。

  • 両端に背景画像を入れる

    画面の左右両端に、縦に繰り返しで、画像を背景として入れたいのですがどうすればよいのでしょうか? <STYLE type="text/css"> <!-- BODY { background-image : url("~~.gif"); background-position: left; background-repeat: repeat-y;} --> </STYLE> スタイルシートを使って、とりあえず左にだけ入れることは出来ました。 このあとを教えてください。お願いします。

    • ベストアンサー
    • HTML
  • CSSで背景にグラデーションをかけたいけどできません。

    filter: progid:DXImageTransform.Microsoft.Gradient (StartColorStr=#000099, EndColorStr=#ffffff, GradientType=0) これをcssファイルのbodyのところに下記のように 付け加えたのですが反映されません。 BODY{ font-style:normal font-weight:normal font-size:small text-align:center;/ color:#000000 filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr=#000099, EndColorStr=#ffffff, GradientType=0) } 元は背景色と背景画像が指定してあった部分 background-color:#ffffff;/ background-image:url(./img/back.gif);/ を消してそこに入れたのですがそれは問題ないですよね? 教えてください、お願いします。

    • ベストアンサー
    • 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
  • 背景画像が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

専門家に質問してみよう