相信很多人在寫頁面的時(shí)候遇到過這樣的一種問題，外層div（設(shè)置背景色，寬度為100％）是通欄的亲族，內(nèi)部設(shè)置一個(gè)頁面的主體部分內(nèi)容，這個(gè)時(shí)候如果我們將瀏覽器窗口縮小的時(shí)候可缚，這時(shí)候右側(cè)超出當(dāng)前瀏覽器窗口大小的部分就會(huì)失去了我們給外層設(shè)置的背景色霎迫。如下圖所示，這是為什么呢帘靡？知给？
image.png
解析：
這是因?yàn)橥鈱觗iv設(shè)置的100％是相對(duì)于當(dāng)前文檔所言的，也就是瀏覽器的窗口大小描姚，現(xiàn)在我們假設(shè)當(dāng)前瀏覽器窗口是1000px涩赢，而主體內(nèi)容部分是1200px，那么轰胁，當(dāng)我們把瀏覽器窗口縮放到1000px時(shí)谒主，也就是外層的div實(shí)際上只有1000px了，而我們的背景色是對(duì)外層div進(jìn)行設(shè)置的赃阀，這樣就會(huì)出現(xiàn)上述圖片的問題霎肯。
解決：
其實(shí)解決方法很簡單，只要我們給外層的div增加一個(gè)min-width: 1200px;就可以了榛斯。
原因：
這是因?yàn)槿绻覀儾辉O(shè)置了最小寬度观游，那么當(dāng)外層的div縮放到1000px的時(shí)候，內(nèi)層的div仍然是1200px驮俗，但是我們的css只設(shè)置了外層div的北京顏色懂缕，因此只有外層的部分顯示背景色，而當(dāng)我們拖動(dòng)滾動(dòng)條的時(shí)候右側(cè)的背景色就沒有了王凑。
