余白を設定するCSS(スタイルシート)

ここでは、余白を設定するCSS(スタイルシート) に関する記事を紹介しています。
--/--/--(--)
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
2006/07/10(月)
余白の設定:padding(パディング) & margin(マージン)

余白を設定するスタイルシート(CSS)として、「margin」と「padding」があります。

margin
(マージン)

サンプル
margin:10px
margin(マージン)について
「margin」は、コンテンツの外側の余白を設定するCSSです。
・数値+単位で指定 :(em, ex, pt, px)など
・数値+%で指定 :ひとつ外側のボックスに対する割合
・auto :自動調整(プラウザの設定に依存)
 ※マイナス指定可能

padding
(パディング)

サンプル
padding:10px
padding(パディング)について
「padding」は、コンテンツの内側の余白を設定するCSSです。
・数値+単位で指定 :(em, ex, pt, px)など
・数値+%で指定 :ひとつ外側のボックスに対する割合
 ※マージンと異なりマイナス指定はできない

 ※余白を利用することで、任意の位置にコンテンツを配置させることができます。
上部スペース(50px)
下部スペース(20px)
左側スペース(100px)
margin:50px 0px 20px 100px;


さすが!と言わせる FC2ブログ徹底攻略術
HTML&スタイルシート レイアウトブック

この記事へのコメント
URL:
Comment:
Pass:   
この記事のトラックバックURL
http://weblog2983.blog39.fc2.com/tb.php/133-25fa1012
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。