賢威6.1コンテンツ部分背景色を変更し枠線もつける設定方法

賢威6.1では、コンテンツ部分が背景色に溶けていて
枠線だったり背景との区別化が特にされていません。
(当サイトの表示も記事部分もサイト背景も白で統一しています)

コンテンツ部分に背景色を入れて枠線も設定する方法を解説します。

参照:賢威6.1コンテンツ部分に枠線を入れる設定方法
上記記事の設定でも各コンテンツに枠線を簡単に入れられます。

wordpress賢威


今回の編集も、Wordpressの「外観」→「テーマ編集」→「design.css」
こちらを編集していきます。

コンテンツ部分背景色を変更し枠線もつける設定方法

賢威6.1のdesign.css部分に以下の記述を加えていきます。

コンテンツの背景色が白くなり、枠線をつける設定方法

#main-contents .contents{
margin-bottom: 20px;
padding: 20px;
background-color: #fff;
border: 1px solid #666!important;
color: #333;
}

#sidebar .contents{
margin-bottom: 20px;
padding: 20px;
background-color: #fff;
border: 1px solid #666!important;
color: #333;
}

上記の記述は、
  • メインコンテンツとサイドバー部分を変更
  • その部分の背景色を#fff(白色)に
  • 枠線をつけて1pxの太さで
という記述になります。

実際の表示は以下のようになります。
賢威6.1背景色と枠線


簡単な記述の解説は以下画像を参照して下さい。
賢威6.1背景色設定


上記と違う背景色に変更したい場合

色の指定は、以下サイトを参照して下さい。
参照:HTML色見本


sub-contends部分も同じように設定したい場合は、
上記の記述の最初の指定を#sub-contentsとして追加すれば設定できます。


賢威6.1WordPressテンプレート導入からカスタム設定方法まとめに戻る


当サイトは人気ブログランキングに参加しています。
かなりな位置にいますので、是非現在の順位を以下のボタンより確認してみて下さい。
↓ ↓


記事の内容はいかがだったでしょうか?

もしも当記事を読んで少しでも興味深く思われましたら、
以下のソーシャルメディアボタンで共有してもらえると嬉しいです!
  

コメントを残す


月収100万円を稼ぐ為のメルマガ講座に無料登録しませんか?


お名前 必須
メール 必須



サブコンテンツ

このページの先頭へ