前回に引き続き、新規ページの制作を行いました。
h2タグの下に余白を入れる場合、
h2 { margin-bottom: 50px; }
などとしますが、単純にh2と指定すると他の場所や、他のページのh2にも影響してしまします。
特定の場所のh2に対して指定したい場合、ID名やclass名を組み合わせて指定します。
#pattern h2 { margin-bottom: 70px; }
同じ指定を複数箇所に行う場合、同じ指定を複数箇所に書いても良いですが、
.freepattern h1 { margin-top: 0; }
.thanks h1 { margin-top: 0; }
効率も悪く、メンテナンス性も落ちるので、対象箇所をカンマで区切って書きます。
.freepattern h1, .thanks h1 { margin-top: 0; }
意図しない場所に余白が付いてしまっている場合、何に対して余白が付いているのか調べます。
ブラウザ上で二本指タップ、メニューから「検証」(Chromeの場合)で調べます。
同じレイアウトを繰り返したい場合、そのかたまり毎をコピーして貼り付けます。
どこからどこまでがひとかたまりかは、Bracketsの場合、開始タグをクリックするとそれに対応した終了タグの色が変わるので見つけやすいと思います。