読者です 読者をやめる 読者になる 読者になる

気ままに殴り書き

日々感じたことを、気ままに書き記す予定でしたが。。。

はてなブログ、画像・写真の大きさを固定する方法

ブログ運営 ブログ運営-カスタマイズ

記事と言えないような簡易なもので恐縮ですが、私の備忘録も兼ね、はてなブログにおいて画像・写真をブログに掲載した際の大きさを固定する方法を記載します。

まずは、見たまま編集にて写真をそのまま貼り付けた場合の例です。見たまま編集で写真の四隅のうち1つを任意のサイズまでドラッグすると写真サイズは変更され、そのサイズでブログに表示されます。ただし、この写真をクリックした場合、写真が拡大されてしまいます。

 

f:id:kminebg1110:20150719160221j:plain

アイキャッチ画像にする場合、写真・画像は拡大して欲しくなく、固定としたいですね。ブログ初心者(はじめて2ヶ月半)の私はこの固定で苦労しましたが、とある諸先般のブログを拝見し(申し訳ありません。どのブログだか失念しました)、簡単に以下の方法で固定することができました。

はてなブログで、画像・写真の大きさを固定する方法

HTML編集モードにて、下記の冒頭にある"hatena-fotolife"のhとaの間に"-"を挿入するのみで固定できました。初心者のため、固定できる理由は不明です。。。

(修正前)

 <p><img class="hatena-fotolife"

(修正後)赤文字のとおり、hatenaをh-atenaにする。

 <p> <img class="h-atena-fotolife" 

 ▼固定した写真がこれ。写真をクリックすらできません。

 f:id:kminebg1110:20150719160221j:plain