ボックスモデル
幅
高さ
パディング
ボーダー
マージン
幅：
幅：長さ値|パーセンテージ|自動
最大幅;
最大幅：長さ値|パーセンテージ|自動
最小幅：最小
幅：長さ値|パーセンテージ|自動
説明：ブロックレベルの要素と置換要素のコンテンツ幅を設定します
ie6は、最大および最小の幅/高さをサポートしていません
ブロックラベルはライン全体を占め、背景色、幅、高さでいっぱいに設定できます
高さ：
高さ：長さの値|パーセンテージ|自動
最大高さ：
最大高さ：長さの値|パーセンテージ|自動
最小の高さ：
最小-高さ：長さの値|パーセンテージ|自動
説明：ブロックレベルの要素と置換要素のコンテンツの高さを設定します
ボーダー属性：
ボーダー幅ボーダー幅
ボーダーカラーボーダーカラー
ボーダースタイルボーダースタイル
border-width：thin | medium | thin | length value
border-color：color |
parallel set border-style、border-color、border-widhtは、境界線の4つの方向で同じスタイルになります。
省略形：
border：width style color
border-left：widthスタイルカラー
.one{
border: 10px #e899ee solid;}
.two{
border-top:5px red solid;
border-Left:1epx blue dotted;
border-right:1epx blue dotted;
border-bottom :5px red solid;
}
パディング属性値を負にすることはできません
Webページのボックスが占めるスペースは、幅と高さの属性だけでなく、パディングにも関連しています。
.one{
width:300px;height:308px;background-color: #acacac;padding : 20px 10px 10px;}
.content{
width:100%;height:100%;background-color:#ececec;}
マージン
略語やパディングと同様のマージン
デフォルトでは、対応するhtmlブロックレベル要素にマージンがあり、本文のデフォルトは8pxです。
通常、デフォルトのスタイルを上書きします
body,h1,h2,h3,h4,h5,h6,p{
margin:0;}
マージン値は自動で、水平方向のセンタリングの表示効果を実現します
。マージンはブラウザで計算します。
マージン折りたたみ
用の標準ボックスの幅と高さの計算：
標準に加えて、IEボックスもあります
どのWebページを選択しますか？
実際、doctypeドキュメントタイプ宣言がある場合は、標準を使用します。それ以外の場合、ブラウザは
HTML要素の分類を選択します。
ブロックレベルの要素、1行を占める
p div h1〜h6 ul li ol dl dtddなど。
インライン要素（インライン要素）、1行は
emにまたがるなどを示します。
インライン要素には、幅と高さの属性設定がありません
インラインとして表示されるインラインブロックインラインブロック要素である特別なimgもありますが、ブロックの対応する特性があります
表示：なしは表示されません
設定することでブロックレベルをインライン要素として設定することは可能ですか？答えはイエスです。
表示属性で設定できます
<head>
.one{font-size:Opx;}
div{dispLay:inline;
font-size:16px;}
</head>
<div class="one">
<div>display </div>
<div>display </div>
<div>display </div>
</div>
にとってインライン要素間にギャップがあります問題を解決するために改行を削除することに加えて、上記の対応するcssプロパティを設定することによっても達成できます。
総括する
次へ：
フロートフロート！
今日の一言：
流行している/ファッショナブルな置き換え人気
