html - 如何用css令背景圖能夠撐滿本身會滾動的頁面?
問題描述
使用height:100%和background-size:100%的話只是屏幕可見區(qū)域撐滿,如何能夠讓滾動到下方區(qū)域也能夠撐滿?補充一下是移動端的,并且背景圖需要同時滾動,樓下的cover方法試過還是不行
問題解答
回答1:試試用css3這個屬性background-size:cover,默認(rèn)自適應(yīng)屏幕,會拉伸圖片。補充:如果是移動端的話如:已測試,手機可以查看效果-鏈接:http://yulei521.github.io/input_autofocus/background.html
background-attachment:fixed;固定背景圖片,這樣在你滾動時,圖片不會動!
回答3:有很多種方法都可以實現(xiàn) 除了樓上兩位的方法 還有一個最簡單的position:fixed
回答4:這樣可以實現(xiàn),已經(jīng)測試過過,不過background-size存在兼容方面的問題,在IE6(7|8)上不兼容,具體的你試試
body{background: url(img/Koala.jpg) no-repeat;background-size: cover; }回答5:
body{ background:url(images/a-1.jpg) center no-repeat; background-size:cover;}
相關(guān)文章:
1. Docker for Mac 創(chuàng)建的dnsmasq容器連不上/不工作的問題2. docker安裝后出現(xiàn)Cannot connect to the Docker daemon.3. docker - 如何修改運行中容器的配置4. python3.x - python連oanda的模擬交易api獲取json問題第五問5. nignx - docker內(nèi)nginx 80端口被占用6. css3 - 沒明白盒子的height隨width的變化這段css是怎樣實現(xiàn)的?7. javascript - webpack熱加載配置不生效8. javascript - QWebEngineView 如何爬 angular 的動態(tài)數(shù)據(jù)?9. java - SSH框架中寫分頁時service層中不能注入分頁類10. java - instance method中 static后的<K>是什么意思?
