WordPressテーマ「STINGER3」の画像に枠線を表示するカスタマイズ

STINGERWordPress
この記事は約1分で読めます。

当ブログは、検索エンジン最適化(SEO)に強いと言われているWordPressテーマ「STINGER3」を使用しています。

今回は、その「STINGER3」の投稿ページの画像に枠線を表示し、中央揃えにしたいと思います。

画像に枠線がなく、背景が白色の画像だと、記事本文と画像の境界が分かりにくく、文章が読みにくくなってしまっていたから改善しようと思うわけです。

なお、今回のバージョンは以下です。

  • WordPress 3.9.1
  • STINGER3_ver20140327

スタイルシートの変更

「STINGER3」の記事本文箇所のdivタグは、クラス名が「kizi」なので、CSSファイル(style.css、smart.css)に以下を追記しました。

.kizi img {
	border: solid 1px #ccc;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

クラス名が「kizi」のimgタグについてスタイルを設定し、1ピクセルで枠線を表示し、中央揃えにしています。

これで、記事本文と画像の境界が分かりやすく、文章が読みやすくなりました。

以上です。

参考サイト

【CSS】スタイルシートを使って画像(IMG)を中央揃えにする方法。

WordPress
えふめん

大阪在住、30代。
業務系SE・社内SEの仕事を通じて学んだこと、PCトラブルで困って調べたこと、手作業を効率化して改善したこと、WordPressのブログ運営などの記事を書いています。

えふめんをフォローする
\よかったらシェアしてね/
この記事が気に入ったら
いいね!しよう
最新情報をお届けします。
俺の開発研究所

コメント

タイトルとURLをコピーしました