現在、WordPressのTwenty Fourteenのカスタマイズにはまっています。
今回は、バックグラウンドカラーの変更方法です。
WordPressのTwenty Fourteenで左サイドバーとフッターのバックグラウンドカラーを変更する方法
WordPressのTwenty Fourteenで左サイドバーとフッターのバックグラウンドカラーを変更する方法は次の通りです。
style.cssの以下の個所を変更します。
左サイドバーについては以下のbackground-colorを変更します。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
.site:before { background-color: #000; content: ""; display: block; height: 100%; min-height: 100%; position: absolute; top: 0; left: 0; width: 182px; z-index: 2; } |
以下のように変更すれば、左サイドバーのバックグラウンドカラーが黒から白に変わります。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
.site:before { background-color: #fff; content: ""; display: block; height: 100%; min-height: 100%; position: absolute; top: 0; left: 0; width: 182px; z-index: 2; } |
フッターについては以下のbackground-colorを変更します。
|
1 2 3 4 5 6 |
.site-footer { background-color: #000; font-size: 12px; position: relative; z-index: 3; } |
以下のように変更すれば、フッターのバックグラウンドカラーが黒から白に変わります。
|
1 2 3 4 5 6 |
.site-footer { background-color: #fff; font-size: 12px; position: relative; z-index: 3; } |
フッターのバックグラウンドカラーを白に変更した場合、フォントを黒に変更しておかないと表示が見えなくなります。
フッターのフォントの色については以下のcolorを変更します。
|
1 2 3 |
.site-info a { color: rgba(255, 255, 255, 0.7); } |
以下の通りに変更すればフッターのフォントが黒に変更されます。
|
1 2 3 |
.site-info a { color: rgba(0, 0, 0, 0.7); } |
WordPressのおすすめ本
↓WordPressのおすすめ本はコチラ
コメント