賢威7のメインコンテンツ内の画像に背景をいれる方法

スクリーンショット 2016-03-13 14.22.49

 

今回はメインコンテンツ内(投稿記事・固定ページ)の画像に背景を付ける方法を解説していきます。
⇩賢威についての詳しい情報は下記から⇩
賢威公式サイト
 

賢威7のメインコンテンツ内の画像に背景をいれる

 

画像の背景といってもピンと来ないと思うので、画像の背景とは以下のようなものです。

 

スクリーンショット 2016-03-13 14.27.05

 

分かりやすく黒にしましたが、他の色でも可能です。

 

やり方は以下のコードをbase.cssに追記してみてください。

 

.single .article-body img,
.page .article-body img {
box-shadow: 0 0 10px rgba(0,0,0,.2);
padding: 10px;
background: #000;
}

 

背景色はbackground: #000;で変えることができます。

上記では『黒』になっています。

 

メインコンテンツ内の挿入する画像は何らかの効果を付けた方が見やすいですし、文字と画像にはっきり区切りをつけることができます。

今回は画像+背景でしたが、影をつけるのも効果です。

影のやり方は下記のまとめページに記載していますのでご参照ください。

 

賢威7カスタマイズ大図鑑へ戻る

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2017-01-06-18-39-00 %e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2017-01-06-18-38-20 %e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2017-01-10-12-59-27 スクリーンショット 2017-01-19 18.25.36


コメントを残す

自己紹介・挨拶がないコメントに関しては返答を控えさせて頂きます。
サブコンテンツ

キラの公式LINE@

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-29-7-40-42

このページの先頭へ