http://www.itdecent.cn/p/4a1f36e9ca32參考鏈接

1.誰(shuí)受浮動(dòng)的影響，就讓誰(shuí)清除浮動(dòng)

一、文檔流的概念指什么？有哪種方式可以讓元素脫離文檔流?

文檔流，指的是元素排版布局過(guò)程中，元素會(huì)自動(dòng)從左往右，從上往下的流式排列。并最終窗體自上而下分成一行行，并在每行中按從左到右的順序排放元素。脫離文檔流即是元素打亂了這個(gè)排列，或是從排版中拿走。

讓元素脫離文檔流的方法有：浮動(dòng)和定位。

二、有幾種定位方式，分別是如何實(shí)現(xiàn)定位的，使用場(chǎng)景如何？

CSS定位方式有四種：默認(rèn)定位（static）、相對(duì)定位（relative）、絕對(duì)定位（absolute）和固定定位（fixed）

1.static正常定位，默認(rèn)的定位。就是沒(méi)有定位唄。還說(shuō)的這么神神秘密的。

2.relative:生成相對(duì)定位的元素，通過(guò)top,bottom,left,right的位置相對(duì)于其正常位置進(jìn)行定位。其中的相對(duì)指的是相對(duì)于元素在默認(rèn)流中的位置。

注意：

1.將元素position屬性設(shè)置為relative之后，再通過(guò)top,bottom,left,right屬性對(duì)其進(jìn)行相對(duì)于原來(lái)位置的偏移；

2.元素偏移之后，他本來(lái)在默認(rèn)文檔流中占據(jù)的位置仍然存在，其緊挨其后的元素的定位依據(jù)它本來(lái)的位置定位；(此時(shí)已經(jīng)脫離文檔流，可以向)

3.該元素偏移之后，可能存在覆蓋其他元素的情況，可以使用z-index屬性顯示層級(jí)有限級(jí)別。

3.absolute：生成絕對(duì)定位的元素，相對(duì)于static定位外的第一個(gè)父元素進(jìn)行定位。

position:absolute；position:relative絕對(duì)定位使用通常是父級(jí)定義position:relative定位，子級(jí)定義position:absolute絕對(duì)定位屬性，并且子級(jí)使用left或right和top或bottom進(jìn)行絕對(duì)定位。

注意：

1.絕對(duì)定位的元素已經(jīng)脫離了文檔流，普通流中其他元素的布局就像絕對(duì)元素不存在一樣；

2.絕對(duì)定位的元素的位置是相對(duì)于最近的已定位的祖先元素，如果元素沒(méi)有已定位的祖先元素，它的位置就相對(duì)于body；//有待考察

3.絕對(duì)定位的框可以覆蓋頁(yè)面的其他元素。（包括文字哦，浮動(dòng)的話(huà)是不行底）

4.fixed：本質(zhì)上是一種絕對(duì)定位，不為元素預(yù)留空間。通過(guò)指定相對(duì)于屏幕視窗的位置來(lái)指定元素的空間，且元素的位置在屏幕滾動(dòng)時(shí)不會(huì)發(fā)生變化。應(yīng)用于很多網(wǎng)站頂端的固定導(dǎo)航、右下角的固定廣告等等。

三、absolute, relative, fixed偏移的參考點(diǎn)分別是什么？

absolute偏移的參考點(diǎn)是：相對(duì)于最近的已定位的父元素，如果沒(méi)有，則相對(duì)于body元素；

relative偏移的參考點(diǎn)是：相對(duì)于元素在普通流中的原來(lái)位置；

fixed偏移的參考點(diǎn)是：相對(duì)于瀏覽器窗口。

四、z-index 有什么作用? 如何使用?

z-index屬性用于設(shè)置節(jié)點(diǎn)的堆疊順序，擁有更高堆疊順序的節(jié)點(diǎn)將顯示在堆疊順序較低的節(jié)點(diǎn)前面。

1.z-index僅對(duì)定位元素有效（position:relative||absolute||fixed）;

2.z-index只可比較同級(jí)元素

五、position:relative和負(fù)margin都可以使元素位置發(fā)生偏移?二者有什么區(qū)別？

position:relative和負(fù)margin都可以使元素位置發(fā)生偏移，二者的區(qū)別表現(xiàn)在：

負(fù)margin會(huì)使元素在文檔流中的位置發(fā)生偏移，它會(huì)放棄偏移之前占據(jù)的空間，緊挨其后的元素會(huì)填充這部分空間；

相對(duì)定位后元素位置發(fā)生偏移，它仍會(huì)堅(jiān)守原來(lái)占據(jù)的空間，不會(huì)讓文檔流的其他元素流入。

七、浮動(dòng)元素有什么特征？對(duì)其他浮動(dòng)元素、普通元素、文字分別有什么影響?

浮動(dòng)元素的特征有：

1.塊在一排顯示；

2.內(nèi)聯(lián)元素支持寬高；

3.無(wú)論是塊元素還是內(nèi)聯(lián)元素，沒(méi)有寬度時(shí)默認(rèn)內(nèi)容撐開(kāi)寬度；

4.脫離文檔流；

5.提升層級(jí)半級(jí)。

對(duì)其他浮動(dòng)元素的影響：后浮動(dòng)的元素永不會(huì)超過(guò)先浮動(dòng)元素的頂端。

對(duì)普通元素的影響：浮動(dòng)元素會(huì)從文檔正常流中刪除，使得緊挨它的元素位置發(fā)生偏移，影響布局。

對(duì)文字的影響：浮動(dòng)元素向下延伸時(shí)，不會(huì)影響正常文本的顯示，文本會(huì)相對(duì)于浮動(dòng)元素進(jìn)行偏移。但部分文本背景會(huì)被浮動(dòng)元素遮住。（可參考大話(huà)FLOAT）

浮動(dòng)示例：

八、清除浮動(dòng)指什么? 如何清除浮動(dòng)?

清除浮動(dòng)指的是：在非IE瀏覽器（如Firefox）下，當(dāng)容器的高度為auto,且容器的內(nèi)容中有浮動(dòng)（float為left或right）的元素，在這種情況下，容器的高度不能自動(dòng)伸長(zhǎng)以適應(yīng)內(nèi)容的高度，使得內(nèi)容溢出到容器外面而影響布局的現(xiàn)象，為了防止這個(gè)現(xiàn)象的出現(xiàn)而進(jìn)行的CSS處理，就叫CSS清除浮動(dòng)。

（遺留問(wèn)題，清除浮動(dòng)的方式。方法。）

position的值， relative和absolute分別是相對(duì)于誰(shuí)進(jìn)行定位的？

感覺(jué)還是得做實(shí)例。

1.官方實(shí)例，每天一個(gè)實(shí)例能保證么？而且是做什么實(shí)例呢？

http://www.jb51.net/css/67471.html

/*http://blog.csdn.net/zengyonglan/article/details/53304487*/

http://www.jb51.net/css/173023.html

http://www.itdecent.cn/p/5a7854a73298