• ベストアンサー

CSSでページ毎に見出し画像を変更したい

tsunami02の回答

  • tsunami02
  • ベストアンサー率23% (16/68)
回答No.2

ようはページごとでH1の背景画像を変えたがスタイルの指定は一つにしたいのですね。 簡単です、まず共通のh1背景バーをテキスト画像を抜いて用意します。 あとは左からテキスト画像の部分までの画像を各ページ分、用意し重ねて入れ替えていけばスタイル指定は一つですみます。

mokorobo
質問者

お礼

ありがとうございます。 CSS初心者なのでソースをちょっと難しそうです。

関連するQ&A

  • 画像の回り込みと、見出しの背景画像について

    Wordpressで見出しの背景に画像を設定していて、メディアを追加でイメージを設置し、設置したイメージを左寄せにした場合、見出しと段落は回り込むのですが、見出しに設定してある背景が画像の裏に残ってしまうのを回避するCSSの指定はどうすれば良いでしょうか?

    • 締切済み
    • CSS
  • 「見出し画像+小見出し」と「見出し画像+小見出し」の並べ方

    「見出し画像(文字と同じ大きさ程度)+小見出しのtext」をいくつか縦に並べたいのですが、その間隔をCSSで設定したいと思います。 ■画像A+小見出しtext (この間隔を制御したい) □画像B+小見出しtext (この間隔を制御したい) ★画像C+小見出しtext....以下同じ 「画像+小見出し」をdivでまとめて、それに対して「下方向margin」を与えて間隔を制御したのですが、このやり方は間違った方法なのでしょうか?正しいCSSを学びたいのですが、どなたか教えていただけますか?

    • ベストアンサー
    • CSS
  • CSSでのリンク指定(?)

    現在、外部CSSで、<h1>タグの背景にタイトル画像を表示するように設定しています。 HTML上の<h1>タグ内では、タイトルに値するテキストを入れていますが、ブラウザの表示できない所においやってあります。 その表示されているタイトル画像(h1で表示している部分)に他ページへのリンクを設定したいのですが、こうした場合のリンク設定はどのようにすればよろしいのでしょうか? CSS内で設定することは可能なのでしょうか? それとも、HTML上でなんらかの形でリンク設定を行うものなのでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • 印刷 印刷用css css print.css

    cssを勉強中なんですがいまいち印刷用cssがよくわかりません。 このcssを適用させれば背景で設定した画像もすべてwebと同じように印刷されるのでしょうか? 印刷用のcssを読み込むことはわかるんですがこの印刷用のcss(仮にprint.css)には何を 記述すればいいのでしょうか? どうもいろんなサイトを見てもよくわかりません。 よろしくお願いします。

  • リンキングCSSについて

    どうしても判らないので初心者的なのですが質問させていただきます。 タイトルにもありますように、リンキングCSSについてです。 読み込む元のcssファイルの記述なんですが、どの本、どのサイトを回っても H1{color:#○○○○○○} H2{color:#▲▲▲▲▲▲}等記述してあります。 頭の部分をH1にして読み込むと見出しになってしまうので嫌なのです。 また<p>にした場合ですと、複数記述が出来ません。 ためしに a{color:#○○○○○○} b{color:#▲▲▲▲▲▲}と記述してみましたところ、 これは綺麗に表示されました。 この表示の仕方でも大丈夫なのでしょうか? 「わからないならHEADに記述かインラインにすれば?」と思われる方も いらっしゃりますでしょうが、どうしてもリンキングにしたいのです。 とても困っています。 どなたか宜しくお願いいたします。

  • 見出し<h3>にリンクを追加すると背景画像が表示されない

    h3の見出しに<a>を追加するとh3に設定していた見出し画像がIEで表示されなくなってしまいました。 FireFoxではきちんと表示されているので IEのバグかと思っているのですが、 もし解決方法がありましたら、アドバイスいただければ幸いです。 [HTML] <div class="contents"> <h3><a>見出し</a></h3> </div> [CSS] .contents h3 { background: url(../images/marker_blue_square.jpg) no-repeat 0 0.1em; padding:0 0 0 25px; margin-left:2.2em; margin-top:1em; font-size:medium;} 色々と試してみたんですが、 たとえば、以下のように見出しの文章の一部にリンクを張ると 見出しの背景画像がきちんと表示されました。 [HTML] <div class="contents"> <h3>見<a>出し</a></h3> </div> また、CSSに以下を追加してみたんですが 背景画像が二重になって表示されてしまいました。 [CSS] .contents h3 a { background: url(../images/marker_blue_square.jpg) no-repeat 0 0.1em; padding:0 0 0 25px; margin-left:2.2em; margin-top:1em; font-size:medium;} よろしくお願いします。

  • 背景に画像を使ったページを作りたい。

    タイトルの通り、DreamWeaverを使って背景に画像を使ったページを作りたく方法を考えています。ちなみにレイヤー、CSSは使いたくありません。 自分の少ない知識で考えると、ページプロパティで背景画像を選択して、その上にテーブルを使ってテキスト等を配置する…それしか思いつかないのですが、他に方法はあるのでしょうか? あと、ページプロパティで背景画像を選択すると、ずっとリピートしてしまうと思うのですがリピートさせない方法はあるのでしょうか? また、大きく重い画像をページプロパティで背景に設定した場合、やはりページの立ち上がりの時間は重くなるのでしょうか? 経験が浅いため、HP制作中にいくつも疑問にぶち当たってしまいます。 どなたか、初心者(私が)と言うことを踏まえて、教えていただけないでしょうか。お願いいたします。

    • ベストアンサー
    • CSS
  • 画像のCSS化

    添付のようなグラデーション画像を トップページのバナー背景にしたいのですが CSSで実現するにはどのような方法が簡単でしょうか。 画像をドラッグするとsvgやCSSに変換してくれるサイトなどはないでしょうか

    • ベストアンサー
    • CSS
  • テキストの横にアイコンを並べたい

    先ほども別件で質問させていただいたものです。 ページの見出し(タイトル)部分のはじめに、アイコン(画像)を表示させたいのですが、どうしてもタイトルとぴったりと並んでくれません。 テーブルでガチガチに固めればできるのですが、タイトル部分だけでテーブルは使いたくありません。 このタイトルはh2扱いにしたいと考えておりますので、先ほど、cssでh2の背景にアイコンを設定してみたのですが、やっぱりダメでした。 完成イメージとしては、 ◎「■■■」とは? ↑このようなものです。◎が画像になります。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • CSSで設定した背景画像が印刷されない

    ホームページの製作でCSSを利用して作成をしてみたのですが bodyに設定した背景画像は表示も印刷もされるのですが h1やh2などに設定した背景画像が表示はされるのですが印刷が出来ません。 media="all"にはしたので表示も印刷もされるはずだと思ったのですが。 どのようにすると印刷されますか?