こんにちは。
『やさしいブログの作り方』の松田です。

美味しそうな料理の写真やきれいな風景写真、楽しそうな写真など、ブログの記事の内容をより印象付けてくれる効果があります。

その画像もちょっとしたことで目を引くことができます。

画像の周りに余白と影をつけて写真風にするカスタマイズをご紹介したいと思います。

$メールで届く! アメブロ簡単カスタマイズ 【グローバルナビを無料で作成します!】

ちなみにこの画像は私が自分で作ったハンバーグです。(笑)

画像を加工する際に余白と枠線をつけることでも同じ見え方になりますが、CSSでカスタマイズするといちいち画像を加工することなく余白と枠線をつけることができます。


以下の記述をCSSの最後に追記すると画像に余白と影がつきます。

.articleText a.detailOn img {
border:1px solid #999999;
padding:10px;
background:#fcfcfc;
box-shadow: 3px 3px 3px #cccccc;
}

※CSS編集用デザインスキンのみの対応となります。


最後までお読みいただきありがとうございました。

5つの無料メール講座配信中

これからブログを頑張っていきたい! まずは基本から。
やさしいブログづくりのための、やさしいメール講座(全5回)

「来てよかったです!」と言われるイベントにするために。
少人数イベント実施のための5つのステップ+2が学べるメール講座(全7回)

メルマガ、やってみたいけどどうすれば?という方へ
初めてでも安心して始められる、ステップメールの作り方メール講座(全10回)

パソコンワーク、もっと時短できますよ。
ブロガーさんのための、パソコンワーク時短術10の技メール講座

販売記事を書くポイントを教えます。
初めての販売記事を書いてみよう! 5つのポイント実践メール講座


6月1日、電子出版しました!

ブログを続けていてよかった、そんな気持ちを一人でも多くの人と共有したいと思っています。^^

AmazonのKindleストアにて好評販売中!
やさしいブログが教えてくれたこと