圍繞在內容邊框的區域，就是外邊距，外邊距預設為透明區域設定方式和內邊距大同小異，可以分為：單側設定：margin-bottom/left/right/top
其中，還有乙個是外邊距合併的概念，如果存在兩個盒子，上面盒子的margin是50px,下面乙個盒子的margin是100px，那麼頁面的效果將是上面盒子距離頂部50，下面盒子距離第乙個盒子的距離是100.
而如果兩個盒子的margin都是100，那麼他們的距離仍舊是100.
總結： 盒子外邊距疊加效果遵循距離大的那個值為標準。
下面是乙個內外邊距的綜合使用：
class="container">
class="bd">
class="pd">
class="content">
hello css3
div>
div>
div>
div>
css3檔案內：
body
.container
.bd.pd
.content
CSS盒子模型之外邊距
外邊距 不會影響盒子的大小,但會影響盒子的位置 margin top 上邊距,設定乙個正值,元素會向下移動 margin left 左邊距,設定乙個正值,元素會向右移動 margin right 右邊距,設定乙個正值,下面的元素會向右移動 margin bottom 下邊距,設定乙個正值,下面的元素...
CSS 3 盒子模型
盒子模型解釋 元素在頁面中顯示成乙個方塊，類似乙個盒子，css盒子模型就是使用現實中盒子來做比喻，幫助我們設定元素對應的樣式。盒子模型示意圖如下 把元素叫做盒子，設定對應的樣式分別為 盒子的寬度 width 盒子的高度 height 盒子的邊框 border 盒子內的內容和邊框之間的間距 paddi...
CSS3盒子模型
2.1.2 內容區 2.1.3 邊框 border color 邊框顏色 border style 邊框樣式，也可以指定不同方向的邊框的樣式 2.1.4 內邊距 2.1.5 外邊距 通常左外邊距和上外邊距會移動自身，右外邊距和下外邊距會移動其他元素 2.2.1 水平布局 乙個元素在父元素中，水平布局...