在 CSS 中，文檔流是指 HTML 元素按照與 HTML 代碼編寫順序一致的方式排列的方式。

.box {
float: left;
width: 50%;
}
.box img {
max-width: 100%;
height: auto;
}

上述 CSS 代碼中，我們使用了浮動(dòng)（ float ）屬性將兩個(gè)盒子分別放在頁(yè)面的左右兩側(cè)。這就打破了文檔流，導(dǎo)致在沒有進(jìn)行其他設(shè)置的情況下，頁(yè)面中的其他元素將會(huì)圍繞著這兩個(gè)盒子排列。

除了浮動(dòng)，CSS 中還有一些其他的屬性同樣會(huì)影響文檔流，例如：

• 定位屬性（ position ）
• 顯式寬度和高度（ width 和 height ）
• display: inline-block

這些屬性會(huì)使元素脫離文檔流，因此在進(jìn)行布局時(shí)需要注意。

盡管脫離文檔流可能會(huì)帶來一些靈活性和復(fù)雜度，但在某些情況下，使用文檔流可以讓代碼更加清晰和易于維護(hù)。同時(shí)，遵循文檔流也有助于確保網(wǎng)站在不同的設(shè)備和瀏覽器上都能夠正確地顯示。