質問: htmlの編集でうまくいかない部分があるので質問させてください。 h1タグに背景画像を設定したいと考えています。 この画像はWebサイト全体で統一ではなく、 サイト内の1つひとつのページ固有のものを設定したいと考えています。 PC表示用とタブレット表示用、スマートフォン表示用を設定しユーザーの 端末によって表示するデータを切り替えたいと思っています。 h1タグの文字列は画像の中央に配置したいです。 また、閲覧する端末問わず同じ画像を画面サイズに合わせて表示させる場合はどのような設定が最適でしょうか。 サイトを見比べながらやっていますがなかなかうまくいきません。 htmlやcssの記述の具体例をご教示ください。
回答: とりあえず、background-size: 100% を指定すれば背景画像の幅が100%で収まるように拡大・縮小されると思います。 以下は括っているdiv要素でサイズを決めて左右中央寄せで配置してテキストをセンタリングして、h1要素は背景画像とその表示サイズだけ指定する例です。 ヘッダ