網頁設計中讓一張圖片填充滿整個畫面背景


方法一:

設置兩層div,底層div當做背景使用,放置一張圖片即可。
<div id="background" ><img src="1.jpg" width="100%" height="100%"/></div>

再將網頁內容放置到第二層上<div id="content">頁面內容</content>

方法二:

background屬性有個background-size屬性,可以設置背景圖片所占div的比例,可以拉伸或收縮。

如果想在整個窗口顯示背景圖片,在body屬性加上{background:url(); background-size:100% 100%;}

這時能看到,整個背景圖片顯示在窗口中,且隨着你的放大縮小可以拉伸。

另外加上自己的box-sizing屬性的補充:box-sizing只影響元素和其padding,跟背景顏色一樣,背景顏色之在元素與其padding內顯示。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM