盒模型：
垂直方向布局
mt + bt + pt + height + pb + bb + mb =父元素的高度
[if !supportLists]1)?[endif]寬度是auto時(shí)辕狰，子元素會(huì)占滿父元素 ?
父元素寬度auto,父元素寬度占整個(gè)屏幕毅戈。
子元素寬度為auto,子元素寬度與父元素一樣
父子元素同時(shí)為auto,父子元素同時(shí)為屏幕寬度躲庄。 ????????
2)高度是auto時(shí)下翎，父元素的高度由其內(nèi)容的高度決定 ????????????????
3)如果不為父元素指定高度，則父元素會(huì)自動(dòng)適應(yīng)子元素的高度，確保能容納所有的子元素 ????????
4)如果為父元素指定了高度，則指定多少就是多少黎比， 此時(shí)如果子元素的大小超過了父元素，則會(huì)導(dǎo)致子元素從父元素中溢出鸳玩。溢出的子元素不會(huì)影響到頁(yè)面的布局
2阅虫、溢出????????
使用overflow來設(shè)置溢出內(nèi)容的處理方式
可選值：
visible，默認(rèn)值 溢出內(nèi)容不會(huì)被裁剪直接在父元素外部顯示
hidden不跟，溢出的內(nèi)容會(huì)被裁剪颓帝，超過父元素的不會(huì)顯示
scroll，生成滾動(dòng)條，可以通過滾動(dòng)條查看完整內(nèi)容
auto购城，根據(jù)需要生成滾動(dòng)條
3吕座、外邊距折疊
垂直方向、相鄰的外邊距會(huì)發(fā)生外邊距折疊現(xiàn)象工猜。
1）[endif]兄弟元素間的相鄰?fù)膺吘啵?/p>
1>?[endif]正值：取兩個(gè)邊界的最大值
2>?[endif]負(fù)值：取絕對(duì)值較大的
3>?[endif]一正一負(fù)：取兩個(gè)值的和
2）[endif]父子元素間的相鄰垂直外邊距：
子元素的外邊距會(huì)傳遞給父元素（給子元素設(shè)置外邊距時(shí)米诉，父元素也會(huì)跟著改變）
解決方法：偽元素：：before
4、文檔流(標(biāo)準(zhǔn)流篷帅、常規(guī)流) ??
文檔流是網(wǎng)頁(yè)中的一個(gè)位置，默認(rèn)情況頁(yè)面中的所有元素都在文檔流中排列拴泌。
1> 塊元素在文檔流中的特點(diǎn)
1魏身、自上向下進(jìn)行排列（獨(dú)占一行）
2、默認(rèn)寬度和元素一樣
3蚪腐、默認(rèn)高度被內(nèi)容撐開
2> 行內(nèi)元素在文檔流中的特點(diǎn)
1箭昵、自左向右水平排列，如果一行中不足以容納所有的元素則切換到下一行繼續(xù)自作向右水平排列（和我們書寫習(xí)慣一樣）
2回季、默認(rèn)高度和寬度都被內(nèi)容撐開
5家制、行內(nèi)元素的盒模型
1>內(nèi)聯(lián)元素不支持設(shè)置寬度和高度
2>內(nèi)聯(lián)元素可以設(shè)置padding，但是垂直方向的padding不會(huì)影響頁(yè)面的布局
3>內(nèi)聯(lián)元素可以設(shè)置border泡一， 但是垂直方向的border不會(huì)影響頁(yè)面的布局
4>內(nèi)聯(lián)元素支持水平方向的外邊距颤殴，不支持垂直方向的
5>水平方向相鄰的外邊距不會(huì)重疊，而是求和
6鼻忠、display ：指定元素所生產(chǎn)的框的類型（把行內(nèi)元素變成塊元素涵但、行內(nèi)元素等）
可選值：
inline：行內(nèi)元素
block：塊元素
inline-block：行內(nèi)塊元素，既有行內(nèi)元素的特點(diǎn)帖蔓，不獨(dú)占一行矮瘟；又有塊元素的特點(diǎn)，可以設(shè)置寬高
none：元素不在頁(yè)面中顯示
7塑娇、 visibility ：可以設(shè)置元素的顯示的狀態(tài)
可選值：
visible：默認(rèn)值澈侠，元素正常顯示
hidden：不顯示元素，但是元素依然占據(jù)位置
8埋酬、默認(rèn)樣式
為了確保網(wǎng)頁(yè)在沒有樣式的情況下哨啃，也可以瀏覽，所以瀏覽器都會(huì)為網(wǎng)頁(yè)設(shè)置一些默認(rèn)的樣式奇瘦，這些默認(rèn)樣式對(duì)于我們的開發(fā)來說是沒有任何作用棘催，并且不同的瀏覽器所設(shè)置的默認(rèn)樣式也是不同，所以開發(fā)中我們要做的第一件事往往就是去除調(diào)瀏覽器的默認(rèn)樣式耳标。
[if !supportLists]1)?[endif]* {
?????Margin: 0;
?????Padding:0;
}
[if !supportLists]2)?[endif]文件（CSS文件)
9醇坝、塊元素和行內(nèi)元素
?1> 塊元素(block) ?:塊元素用于頁(yè)面的布局
[if !supportLists]2>?[endif]行內(nèi)元素(inline) :行內(nèi)元素主要用于在頁(yè)面中選中文字
[if !supportLists]3>?[endif]一般情況下只會(huì)在塊中去放內(nèi)聯(lián)元素，不會(huì)向內(nèi)聯(lián)元素放塊元素
p元素中不能放任何的塊元素
a元素里邊什么都能放，除了它自己
?
******************
10呼猪、display 做隱藏的菜單欄
1>隱藏的元素與 ?hover 元素是 祖先與后代的關(guān)系
例：li為祖先（用 :hover） , ??.inner隱藏為后代
