css盒模型：
外邊距 邊框 內填充 內容
盒模型分為兩種：
標準盒模型：
怪異盒模型（ie盒模型）：
邊框：border
border: 10px solid blue;表示設定10畫素藍色實線條的邊框
是以下三個樣式的復合語法
border-width: 10px; 設定邊框的寬度
border-color: blue; 設定邊框的顏色
border-style: solid; 設定邊框的樣式
solid：實線
dashed: 虛線 裝訂線
dotted: 點線
double: 雙線
如何單獨設定乙個邊的邊框：
border-left:
border-right:
border-top:
border-bottom:
border-radius 設定圓角邊框 取值可以是 px % em 最大設定範圍到50% 超出則按照50%計算
引數最少可以設定乙個 最多可以設定八個
border-radius: 5px 50% 50% 50% / 5px 50% 50% 50%;
前四個值代表水平方向的取值 左上 右上 右下 左下
後四個值代表垂直方向的取值
利用css邊框知識 在頁面繪製乙個三角形：
需要將乙個盒子寬高設定為0 然後設定四個邊框，其中三個面的邊框顏色設定成透明色，則會顯示成乙個三角形
width: 0px;
height: 0px;
border-left: 200px solid transparent;
border-top: 200px solid transparent;
border-right: 200px solid transparent;
border-bottom: 200px solid #ff0;
內容： 我們所設定的寬和高 實際上指的是內容區域的寬高 （標準盒模型）
width 寬
height 高
外邊距和內填充：
padding 內填充 （內邊距/內補白） ： 表示乙個元素，邊框和內容之間的距離
padding: 20px; 如果只給乙個值，代表上下左右的內填充同時設定20px
padding: 20px 40px; 如果給兩個值 第乙個值代表上下 第二個值代表左右
padding: 20px 40px 60px; 三個值 第乙個值代表上 第二個值代表左右 第三個之代表下
padding: 20px 40px 60px 80px; 四個值分別對應 上 右 下 左 以順時針方向賦值
padding-bottom:; 單獨設定一邊的內填充 可以使用 padding-方向 來設定
margin 外邊距（外補白） 表示元素與元素之間的距離，也就是邊框以外的距離 設定的值和內填充原理一致
當設定外邊距時 如果兄弟元素之間，上下的外邊距有重合，則取最大值
去除瀏覽器預設的所有標籤的外邊距和內填充
*設定乙個盒子在父元素寬度內水平居中
margin:0 auto;
外邊距的重合問題：
當子元素和父元素的上外邊距重合到一起時，不管給小盒子還是大盒子設定上外邊距，影響的都是大盒子，
取值取兩者的最大值
盒模型的計算：
標準盒模型 寬度計算： width + paddingleft + paddingright + borderleft + borderright + marginleft + marginright
ie盒模型 寬度計算： width + marginleft + marginright
標準盒模型 設定的 width = 實際內容的寬度
ie盒模型 設定的 width = 實際內容的寬度 + 邊框的寬度 + 內填充的寬度
兩種盒模型之間的轉換：
box-sizing:content-box; 標準
box-sizing:border-box; ie
盒模型 內外邊距和邊框
盒模型 內容 內邊距 邊框 外邊距 如圖 邊框顏色 border color blue rgb 255,0,0 fff000 transparent 透明，預設值不常用可不記 邊框厚度 border width thin medium thick 1em 2px 0.1 thin 細邊框，mediu...
內外邊距 盒模型 浮動
盒子 容器 盒子模型 英文 box model。最常見的盒子是 div span 盒子中的區域 content 1.寬 width px content 2.高 height px content 3.內邊距 padding 4.外邊距 margin 5.邊框 border 注意 標準盒模型的寬和高...
css 盒模型的外邊距
外邊距 margin 外邊距不會影響盒子可見框的大小 但是外邊距會影響盒子的位置 一共有四個方向的外邊距 margin top 上外邊距，設定乙個正值，元素會向下移動 margin right 預設情況下設定margin right不會產生任何效果 margin bottom 下外邊距，設定乙個正值...