無料お金儲け得するサイト総合topへ サイトマップ

CSSでホームページをデザインする。

CSS(カスティングスタイルシート）は、あなたのホームページをクールにデザインするのに必要になるスキルです。
最初は少しむつかしく感じるかもしれませんが、理屈さえ解れば簡単なのでがんばって理解してください。

ボックスモデルを理解する

ボックスモデルとは？

CSSの基本的な概念として箱とゆうコンセプトでレイアウトしていきます。

divで囲んだ各要素を箱を積み上げるようにデザインしていきます。

ボックスモデルは、ＣＳＳでレイアウトや各要素をデザインするのにたいへん重要なのでよく理解してください。

4つの領域を理解する。

余白(margin)

ボックスの最も外側にある余白部分をマージンと呼びます。要素に指定された背景はこの領域には適用されず，常に透明に表示されます（親ボックスの背景が透けて見える）。また，隣接するブロック間の垂直マージンは相殺されることがあります。

枠線(border)

パディングの外側にある枠の領域部分をボーダーと呼びます。ボーダーはすべてボックスの背景の上に重ねて描かれます。

詰め(padding)

ボーダーと内容領域の間にある空間部分をパディングと呼びます。 要素に指定された背景はこの領域にも描画されます。

本文(content)