border之外是margin， border之內是padding ,padding之內是width & height.
margin垂直外邊距疊加，水平外邊距不疊加。(上右下左，如圓形鐘錶，從半夜0點開始)
width，預設值 auto，會讓元素的寬度與其父元素同寬 .
float:leftorright;,建立多欄布局。
如果幾個相鄰的元素都具有設定的寬度，都是浮動的，而且水平空間也足以容納它們，它們就會並列排在一行 ，
如果乙個元素不想要上浮，
可以設定clear:bothorleftorright；
or 把上浮元素的父元素（如果父元素不同）overflow:hidden;（迫使父元素包含其浮動的子元素，這個屬性是防止子元素衝出父元素的）
or 也浮動上浮元素的父元素； （這時父元素旁邊不能有空間，否則下面的元素會擠上來，不過也可以或者把父元素下面的元素設定為clear:both；）
或者給父元素增加乙個子元素，乙個div，設定成clear:both;
如果沒有父元素，就直接用偽元素 ，如果有，可以在父元素後面新增偽元素。
:after
position：relative;相對於原來的位置定位
static;
fixed;相對於瀏覽器視窗定位
absolute;絕對定位元素預設的定位上下文是 它的祖先元素。
（一般把父元素position設定為relative ,子元素 position
為absolute，即把父元素設定為子元素的定位上下文）
display:
block;塊級元素，比如段落、標題、列表等，在瀏覽器中上下堆疊顯示。
inline;行內元素，比如 a、 span 和 img，在瀏覽器中左右併排顯示，只有前一行沒有空間時才會顯示到下一行。
none;不會頁面中顯示，而且它們原先佔據的所有空間也都會被「**」，
而如果設定visibility:hidden,元素會隱藏，但佔據空間存在。
CSS盒模型 定位流 浮動流
一 盒模型 1 border 寬度 樣式顏色 2 padding 內邊距 3 margin 外邊距 垂直方向會合併 4 content 其它操作 1 box sizing content box 預設 border box 固定元素大小 2 水平居中 1.margin 0 atuo 盒子居中 2.t...
精通css（3） 盒模型，定位，浮動
終於到了css最重要的3個部分 盒模型，定位，浮動。先講盒模型吧。1.盒模型概述 頁面上的每個元素都被看成乙個矩形框。這個框由元素的內容 內邊距 邊框和外邊距組成。內邊距 邊框和外邊距都是可選的預設為0。但是許多元素由使用者 樣式表設定外邊距和內邊距。所以不見的一定是0。在css中，width和he...
CSS盒模型與浮動
box sizing屬性用於改變元素width和height值的具體意義 段落p 標題h1或div等元素是塊級元素，它們生成塊級框，各個框體是縱向堆疊的 即 換行 任何元素可以由display block宣告為塊級元素。注 通過css的display屬性，是可以改變html文件中元素預設的布局方式的...