• 文字サイズ
解決済

h1の背景を画像にして、その上に文字を重ねたい

  • 相談者:非公開
  • 2016/04/19 15:24
お世話になっております。

h1の背景に画像を設定し、その上に文字を重ねたいです。

以下のように組み立てているのですが、文字が表示されません。
どのようにすればよいでしょうか。

よろしくお願いいたします。

<style type="text/css">
<!--
.bace{
margin:0 auto;
background-color:#ffffff;
width:730px;
}

h1{background: url(http://gigaplus.makeshop.jp/morinoen/category/irekata3.jpg) no-repeat;
width:730px; height:50px;}

-->

</style>

<div class="bace">
<h1>ほうじ茶のおいしい淹れ方</h1>

</div>
キーワード:cssh1html
投稿内容について報告する




  • 返信者:非公開
  • 2016/04/19 19:29
ECマスターズの田中です。

<h1>タグに対する規則(h1{ から } の間)に、

text-align:center;

という属性を加えてい………(省略)………
  • 返信者:非公開(質問者)
  • 2016/04/19 19:51
田中様

ご回答ありがとうございます。
h1の画像も表示されないのですが、何が問題でしょうか。

こちらのurlのページです。
http://www………(省略)………
  • 返信者:非公開
  • 2016/04/19 20:26
ECマスターズの田中です。

最初に、いただいた<style>タグの中で、
.base{ の後ろにあるべき } が記入されていないため、
その後ろにある………(省略)………
  • 返信者:非公開(質問者)
  • 2016/04/19 22:51
田中様

ご回答ありがとうございます。
早速修正させて頂いましたが、text-indent:-9999pxを解除することで「ほうじ茶のおいしい淹れ方」とい………(省略)………
  • 返信者:非公開
  • 2016/04/20 10:32
ECマスターズの田中です。

>背景画像が表示されません。なぜでしょうか。

改めてCSSを確認したところ、
h1に対する規則のbackground-………(省略)………
  • 返信者:非公開(質問者)
  • 2016/04/20 11:55
田中様

無事設定ができました。ありがとうございます!

今、以下のurlに
http://www.morinoen.com/html/page50.………(省略)………
  • 返信者:非公開
  • 2016/04/20 12:45
ECマスターズの田中です。

h1タグが1つのページに複数入っていても、
表示上では特に問題はありません。

厳密に、文書としての構造を考えると、
………(省略)………
  • 返信者:非公開(質問者)
  • 2016/04/20 15:01
田中様


詳しくご回答ありがとうございます。
理解いたしました。………(省略)………