CSS（層疊樣式表）是一種用于美化網(wǎng)頁的工具，它可以讓我們對網(wǎng)頁中的元素進(jìn)行樣式修改，美化網(wǎng)頁的同時(shí)提高用戶體驗(yàn)。CSS中文文檔流是一個(gè)很重要的概念，當(dāng)元素在文檔流中時(shí)，它們會(huì)受到其他元素的影響，而脫離文檔流可以讓元素?cái)[脫這種影響，自由自在的顯示在頁面上。

一、使用float屬性

.box{
float:left;
}

當(dāng)我們給元素設(shè)置float屬性時(shí)，它會(huì)脫離文檔流并且其他元素會(huì)忽略它的存在，同時(shí)它也可以與其他元素并排顯示。

二、使用position屬性

.box{
position:absolute;
left:0;
top:0;
}

當(dāng)我們給元素設(shè)置position:absolute屬性時(shí)，它會(huì)脫離文檔流并且其他元素會(huì)忽略它的存在，同時(shí)我們可以通過left、right、top、bottom屬性來設(shè)置元素的位置。當(dāng)然，如果它的祖先元素設(shè)置了position:relative或者position:absolute屬性，那么它將依據(jù)最近的祖先元素來定位。

三、使用z-index屬性

.box{
position:absolute;
left:0;
top:0;
z-index:999;
}

當(dāng)我們給元素設(shè)置z-index屬性時(shí)，它可以控制元素的層級(jí)關(guān)系，使元素脫離文檔流并且其他元素在它之下或之上顯示。

四、使用margin屬性

.box{
margin-left:xxx;
}

當(dāng)我們給元素設(shè)置margin屬性時(shí)，它會(huì)將它本身與其他元素隔開，在一定程度上脫離文檔流。但并不是所有情況下margin都能起到脫離文檔流的作用。

通過上面的介紹，我們可以看出脫離文檔流并不是一件很容易的事情，我們需要根據(jù)實(shí)際情況來選擇相應(yīng)的方法。同時(shí)，脫離文檔流也會(huì)使頁面的布局變得復(fù)雜，因此我們需要謹(jǐn)慎使用脫離文檔流的方法，以達(dá)到更好的效果。