如何解决浏览器缩小出现横向滚动条时网页背景图出现空白的问题
生活随笔
收集整理的這篇文章主要介紹了
如何解决浏览器缩小出现横向滚动条时网页背景图出现空白的问题
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
原因:
當窗口縮小時,瀏覽器默認100%寬度為瀏覽器窗口的寬度。而忽略了下部內容層固定寬度(1024px)。從而出現了固定寬度大于100%寬度的現象。瀏覽以此理解來解析頁面,就出現了容器寬度理解上的差異,出現了一個非常奇特的BUG。
解決方案:
html, body {height: 100%;width: 100%;min-width: 1024 !important;min-height: 768px !important; }.main{width: 100%;height: 100%;min-width: 1024px !important;/* 設置成和body一樣的最小寬度 */background: url('../../images/index/index_bg3.jpg') no-repeat;background-size: 100% 100%; }
?
總結
以上是生活随笔為你收集整理的如何解决浏览器缩小出现横向滚动条时网页背景图出现空白的问题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: css3自适应布局单位vw,vh
- 下一篇: 区别 (function($){...}