1、文檔流的概念指什么？有哪種方式可以讓元素脫離文檔流?
文檔流指的是元素按照其在 HTML 中的位置順序決定排布的過程，或者說在排布過程中將窗體自上而下分成一行行, 并在每行中按從左至右的順序排放元素。
脫離文檔流是布局的時候無視存在或認知存在的位置不變，但是顯示的位置改變。
有三種方式來脫離文檔流：文檔流fix、浮動float、絕對定位position:absolute。
2、有幾種定位方式，分別是如何實現定位的，使用場景如何？
①比如fix是相對于瀏覽器窗口進行定位，不會因為頁面的滑動而改變位置。可以寫top、right、buttom、left來設置位置（其實比如放在右上角定位只需要寫top和right的值就可以啦），同時如果頁面有多個元素會有前后距離關系，可以寫z-index來控制元素的前后優先級，顯示的效果。
②position:relative是不脫離文檔流的對自身位置進行直接定位。可以寫top、right、buttom、left來設置位置，同時如果頁面有多個元素會有前后距離關系，可以寫z-index來控制元素的前后優先級，顯示的效果。
③position:absolute是脫離文檔流的定位方式，相對于自己的父容器或者body進行定位，優先尋找父容器有沒有position:relative，如果沒則按照body來定位。
④position:static是默認的定位方式，不寫的時候就是這個參數，不能設置top、right、buttom、left，z-index也無效。
3、absolute,relative,fixed偏移的參考點分別是什么
absolute偏移的參考點是加了relative的父元素，如果沒有加了relative的父元素則是按照body來定位。
relative是相對于自己原來的位置進行定位。
fixed是相對于瀏覽器窗口進行定位。
4、z-index 有什么作用? 如何使用?
z-index有設置一個DOM元素的堆疊順序的作用，z-index的值更大那么會顯示在更前面的位置，另反。
如果直接寫z-index的參數是沒用的，要寫在比如有position:fix的元素一起。
5、position:relative和負margin都可以使元素位置發生偏移?二者有什么區別
position:relative是相對于自己的原來的位置進行偏移，對頁面結構不會有任何影響，只是這一個元素的顯示的位置會變化，但是瀏覽器認為它實際占用的位置沒有變化。
負margin是直接調整元素的外邊距，這會影響到整體的文檔流。
6、如何讓一個固定寬高的元素在頁面上垂直水平居中?
在父容器上面寫position:relative，這個元素寫在父容器上對于父容器是不會有什么影響的，但是作用是里面的子元素使用position:absolute來定位。不在父容器里面寫position:relative的話，子元素就會按照body來定位了，影響位置的寫法。
再在子元素里面參數寫top:50%； ?left:50%；
根據要垂直水平居中的這個元素的寬高的各一半來設置margin-top和margin-left的值。
（比如需要垂直水平居中的元素寬是100高是200，那么設置margin-top:-100px； margin-left:-50px；醬紫。）
其實還有一種直接的方法，就是直接在需要垂直水平居中的元素上寫上margin-top和margin-left來手動設置元素的垂直水平居中。
7、浮動元素有什么特征？對其他浮動元素、普通元素、文字分別有什么影響?
CSS的浮動最初是解決文字環繞圖片的問題
浮動元素特征：脫離文檔流，會收縮，只能撐開自身所占據的空間，浮動的塊級元素會失去占據一行的特征。
浮動元素和浮動元素之間是互相認可存在位置的，但是非浮動元素不會認可浮動元素的存在，非浮動元素里面的比如文字等會圍繞避開浮動元素。
8、清除浮動指什么? 如何清除浮動?
就比如上面112233看到的圖片例子，當紅色方塊有float:right的時候，DOM下面的正常DIV無視這個浮動元素照樣放在上面，如果你想要下面正常的DIV按照從上往下的順序放到紅色塊的下面的話，可以在這個正常DIV里面寫clear:right或者clear:both。
