很多時候,我們需要將一個背景鋪滿整個屏幕,這時候就需要使用 CSS 來實現。
body { margin: 0; padding: 0; background: url(background-image.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
以上代碼中,我們將背景圖片設置為居中并不重復,然后使用了background-size: cover;
來讓圖片完整地占滿整個屏幕。
如果我們想要背景圖片跟隨滾動而移動,可以將background-attachment: fixed;
加入到代碼中。
body { margin: 0; padding: 0; background: url(background-image.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; }
以上就是實現背景鋪滿整個屏幕的 CSS 代碼,可以根據自己的需求進行調整。
上一篇css字體font-f
下一篇ajax如何下載后臺文件