はてなブログ ヘッダー画像の調整 余白を無くしたい！
新しいブログに移転しました。約5秒で自動的に移行します。
ブログ超初心者の謀議録です。
なかなか苦労したので調べ直さなくて済むように、残しておきます。
（同じ苦労している方が参考にしてくださっても嬉しい…）
ブログのヘッダー画像の余白をなくしたい！
ブログのヘッダー画像、推奨されている1000X200で用意したのに普通に貼り付けると上下左右に余白ができました。
初心者のくせになんとなく見栄えよくしたくてGoogle先生に相談してみたところ色々な方が
「はてなブログ ヘッダー画像 余白 修正」
といった記事を書いてくれていました！
ところが！！
なぜかわたしがやると上手くいかないという謎の事態が発生…。
コードの意味がわかっていない初心者ながら
CSSを使った指示方法が色々あるみたい
ということはわかったので、 とりあえず様々なコードを試してみました。
そして今回うまくいったコードをご紹介してくださっていたのが以下の方々でした。
横の比率
はてな ヘッダー写真を横に広げて余白をなくす CSSコピペだけ - Life百科
上下の空白
はてなブログテーマ Minimalism カスタマイズまとめ - raku books
ネット世界の端っこから影ならがお礼を…。
ヘッダー画像の余白をなくせた！CSSの書き方
管理画面のダッシュボード
→デザイン
→スパナマーク（カスタマイズ）
→デザインCSS
で、デザインCSSの空白に以下をコピペ。
/* ヘッダー画像の比率の調整 */
#blog-title-inner {
height: 200px;
background-size: cover;
background-image: url("画像のURL");
background-position: 50% 50%;
}
/* ヘッダー上下の余白を取る */
#blog-title {
margin: 0 auto;
padding: 0;
}
これがわたしが使ったCSSコード。
「画像のURL」だけは調べる必要あり。
ヘッダー画像の余白をなくすために必要な画像URLの探し方
画像の保管場所さえわかれば普通に画像のURL表示ができました。
→マイフォト （上の黒い帯のところ）
→HatenaBlog（右の灰色のところ）
→ヘッダーに使っている画像をクリック
→画像にカーソルを合わせて右クリック
「画像アドレスをコピー」
まとめと感想
手探りでブログ構築中の超初心者であるわたしの理解は…
でした。
人はうまくいくのに自分は上手くいかないCSSの存在は謎のまま…。
CSSもちゃんと勉強したいなぁ…。
