まず、デフォルトのレイアウトの縦方向に、デフォルトでは、余白は、その大きな聞いマージン、統合現象があるでしょう、はい重畳されていません。しかし、このような状況は、水平方向では発生しません。我々は、例を挙げれ
{スパン 実行表示：インラインブロック; 幅：100ピクセル; 高さ：100pxに; 国境：1pxのソリッドレッド; } div要素{ 幅：100ピクセル; 高さ：100pxに; 国境：1pxの緑色の点灯は、 } / *私たちは、2つのボックスのスパンを聞かせて*離れ100ピクセル/ .hezi1 { マージン右：は50px } .hezi2 { マージン左：は50px; } .box1 { マージン底：は50px; } .box2 { マージントップ：は50px; } ....... ...コードを省略.......... < スパンクラス= "hezi1" >我是スパン</ スパン> < スパンクラス= "hezi2" >我是スパン</ スパン> < divのクラス= "BOX1" >我是スパン</ divの> < divのクラス=」 BOX2" >我是スパン</ DIV >
第二に、ボックスモデル
1.ボックスモデルとは何ですか
：CSSボックスモデルは、比較的比喩、HTMLタグがすべてのボックスに、当社の商品のほとんどがされている実際の生活ゾーニングの位置です。
注：すべてのHTMLタグがすべて設定することができます：幅、高さ、パディング、ボーダー、マージンを
たとえば、2：
< スタイル> スパン、B、強い{ 表示：インラインブロック。 幅：150ピクセル; 高さ：150ピクセル; パディング：20ピクセル; ボーダー：2ピクセル赤い点線; マージン：10pxの; } </ スタイル> ........省略代码.......... < スパン>我是スパン</ スパン> < HREF = "＃">私は、ハイパーリンクしています。</ A > < B >私は大胆である</ B > < 強い>私が強調</ 強いです>
解釈：Googleの開発者向けツールによって、我々が見ることができ、各ラベルの面積は、それらの間の数字に属し、彼らはF12の有益モデルの定義に従って厳密です。
2.幅とボックスモデルの高さ
幅と高さ（1）内容：幅と高さを設定幅\高さ
幅と高さ（2）エレメント：境界線の幅とコンテンツプラスパディングの高さプラス
（3）空間要素の幅と高さ：余白コンテンツプラスパディングを加えた幅と高さを縁取っ
第三に、ソースコード：
d109_margin_merge.html
d110_box_model.html
住所：
https://github.com/ruigege66/HTML_learning/blob/master/d109_margin_merge.html
https://github.com/ruigege66/HTML_learning/blob/master/d110_box_model.html
2.CSDNます。https：//blog.csdn.net/weixin_44630050（西6月6月ムードが知らない - ルイを）
3.パークブログます。https：//www.cnblogs.com/ruigege0000/
4.マイクロチャネル公共数に焦点を歓迎：フーリエ変換だけで技術交流、舞台裏の返信「贈り物」ビッグデータ集録Javaの学習ビデオのパッケージのために、個人アカウントを変換します
