Macの使い方講座：ホームページ更新その10（背景やボタンの色など）

ホームページ更新その10（背景やボタンの色など）

背景の色はsectionごとに白のセクションとグレーのセクションに分けていました。
これを、全て黒い背景にします。
黒の色を真っ黒にするとタイトル部分の画像の黒よりも強くなってしまうので、タイトル部分の色よりも弱い黒にします。

背景色の指定など、現在の状況を確認するには、ブラウザ上で2本指タップして「検証」を選択すると現在の状況を確認できます。

sectionにクラス名をつけて背景色を指定していたので、index.htmlのクラス名sec-grayとsec-whiteをsec-darkgrayにして、style.cssのクラス名に対して背景色を指定している部分の色を変更しました。

背景色を黒系の色にしたので文字の色を白にしました。

ボタンの色は、クラス名btnで指定しています。
style.cssのbtnの部分を修正します。

どのような色が合うかは、
HUE/360というサイトや
https://hue360.herokuapp.com/

を使うと便利です。

ボタンの背景色は、bakground、枠線は、borderで指定します。

メニューの色は、navのクラス名を変えることで白ベースと黒ベースを変えることができます。
ですが、変わりませんでした。

bootstrapのバージョンがv3.3.5でしたので、設定方法が違いました。
class=”navbar navbar-inverse”
で黒系のメニューになります。

フッタの背景色と線の色を変更しました。

SAInoLESSON（サイのレッスン） Macの使い方講座、詳しい情報はこちら。