HTML初級課題１８

制作カモンエギ

設計図で作る２

練習046「設計図で作る２」

ｈ１のボーダーの線は２ｐｘです。
ｈ１の幅はボーダーの分を引いて設定しないとならない事に注意。

↓ＨＴＭＬ

↓ＣＳＳ

犬画像07（実際には猫ですが）は下のを右クリックで保存して使ってね。

設計図で作る３

練習047「設計図で作る３」

左右対称のデザインにしました。
ｐやｈ２の位置の割り出しがポイントです。

ｈ２のスタイルの仕方をわざと上の「設計図で作る２」とは別の方法で設定しました。
やり方はいろいろあるのです。

フロートに対するマージンの効き方がブラウザによって違いがあるので注意。
インターネットエクスプローラーなら下のコピーライトにマージントップを設定しても、

フロートしてるｈ２を素通りしてPの下からの距離になったりします。
しかし、ｈ２のマージンボトムに設定するとちゃんとコピーライトとの隙間に反映される・・・。