はてなブログのレスポンシブデザインなのですが、

タイトル画像を可変させる事は不可能なのでしょうか?
もしくはスマホ用にタイトル画像のみ別のものに設定するのは不可能なのでしょうか?

現在タイトル画像をロゴ画像に設定しているのですが、
PC合わせにしている為にスマートフォンで閲覧した場合、ロゴの左右が切れてしまいます。
スマートフォン合わせにしてしまうとどうもバランスが悪くて・・・

調べても調べても出てこなくて頭がかち割れそうです、、、
どなたか教えていただきたいです。

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2016/04/30 10:14:09

ベストアンサー

id:psne No.1

回答回数605ベストアンサー獲得回数334

@media (max-width: 480px) {
#blog-title {
	height: initial;
}
.header-image-only #blog-title #blog-title-inner {
	height: initial;
	background-size: contain;
}
  
}

はてなブログ デザイン設定のデザインCSSにて、上記を入れて様子を見てください。
※メディアクエリを入れ忘れたので、修正しました。

他3件のコメントを見る
id:psne

こちらの設定だけではタブレットサイズが考慮されていないので、はてなブログのテーマ作成ページのサンプルを参考にサイズの設定を行ってみて下さい。

2016/04/30 10:17:49
id:ptkabe

すべての数値を90%に設定してロゴ画像を見やすいものに変えた所、きちんと表示されるようになりました。
とてもすっきりしました!ありがとうございます!

2016/04/30 10:55:22
  • id:psne
    レスポンシブモードを解除する(スマートフォン版を表示)事で、独自のヘッダ画像を設定する事ができます。
  • id:ptkabe
    回答ありがとうございます。
    それについては知っているのですが、
    レスポンシブデザインのままで何とかならないかと思いまして。。

この質問への反応(ブックマークコメント)

トラックバック

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません