初心者の僕にもできた!はてなブログで画像の位置を変更する方法!
どうも、はてなブログを使いこなすのにまだまだ苦戦しているブログ主ゴブリンです。
まだ、はてなブログは始めたばかりなので画像に時間を割くよりも記事を書けよって突っ込まれそうです(誰から?( ̄▽ ̄;)?)
画像の位置を中央に変更したい!
真ん中
僕は、この方法を使っていないのですが、投稿した画像を全部中央揃えにしたい人に最適な方法です。
まずは、デザインを選択します。
管理画面のスパナのアイコンのカスタマイズをクリックします。
デザインCSSをクリックします。
以下の文を上記の画像のように記述(コピペ)してください
.hatena-fotolife, .http-image {
display: block;
margin: 0 auto;
}
最後に変更を保存をクリックすると画像が中央揃えになります。
全ての記事の画像が中央揃えになるので注意してください。
HTML編集から直接CSSを記述する!
HTML?CSS? 少し難しく感じるかもしれないけど、この方法を覚えると投稿した写真を右寄せ、左寄せ、中央と自在に位置を変更できるようになります。
まずは何か写真を投稿して、HTML編集をクリックします。
Pタグで囲まれた青枠の部分が、金の招き猫のHTML文になります。
画像はimgから始まると覚えておくと探しやすいです。
imgを囲んでいるPタグにクラス(class)をつけてあげます。(画像参照)
<p class="cat"> " "の中は、半角英数字ならnekoでもなんでもOK!
スタイルタグ(<style>)の部分がCSSの部分になります。
<style>
.cat {
text-align:center;
}
</style>
右に寄せたいときは、text-align:right;にしてあげればいいのですが、画像の位置を別々にしたいときは、classの名前を変えて、CSSの部分(緑色)のところを変更してください。
まとめ
cssは覚えるとデザイン見栄えが全然違ってきます。
デザインに夢中になって、記事に時間が無くなったなんてことにならないようにしてくださいね(;'∀')