こんにちは。@りょうです。

今日はヘッダーを作成するために必要な
「サイズ」を確認していきます。


ヘッダーの大きさを確認

※ブラウザはgoogle chromeを使っていることを前提に進めますので、使っていない方はこちらからダウンロードしてください。
google chromeをダウンロード


ブラウザをダウンロードして自分のブログを表示させたら
ブログのヘッダー部分で右クリックし、
要素を検証をクリックします。

g4-1


そうすると、画面の下方にHTMLが表示されます。
以降、ここを参考にCSSへ変更を加えていくことになります。

g4-2


この要素部分でカーソルをちらちら動かすと、
カーソルの乗ったタグが
ブログのどの部分を構成しているかがわかります。

いろいろ動かして確認してみてください。

<div class="skinHeaderArea2">の上にカーソルを当てます。

そうするとブログのヘッダー部分が青く示され、
その下にサイズが表示されます。

g4-3

拡大↓

g4-4


980px × 105px とありますので、
現在ヘッダーの設定は横980px、縦105px。
よって、
横980pxの画像を用意する必要があることがわかりました。

ヘッダーの横幅を広くする場合、
先にブログ本体の幅を広げなければならないので
今回は横幅はこのまま。
縦を300pxに変更することにして(この作業は後ほどやります)
横980px、縦300pxの画像を作成することにします。

では、次のエントリーからやっと画像作成に入ります。
やっとですね。
GIMPダウンロードをこの次にすればよかった。反省。
AD

コメント(5)