CSS3 是一種強大的樣式語言,它的背景樣式功能豐富,可以輕松地創建各種驚人的背景效果。其中,背景鋪滿是一種很常見的效果,下面就來介紹一下如何用 CSS3 實現背景鋪滿。
body { background-image: url(bg.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center; }
上述代碼中,我們使用了 background-image 屬性來設置背景圖像,其中 bg.jpg 是我們要使用的圖片的 URL 地址。接下來,我們使用了 background-size 屬性來指定背景圖像的尺寸,將它設置為 cover 可以讓圖片盡可能地覆蓋整個屏幕。
同時,我們還使用了 background-repeat 屬性來指定背景圖像的重復方式,將它設置為 no-repeat 可以讓圖片不重復出現。最后,我們使用了 background-position 屬性來指定背景圖像的位置,將它設置為 center center 可以讓圖片在屏幕中央居中顯示。
通過以上的 CSS3 代碼,我們可以輕松地實現一個鋪滿整個屏幕的背景效果,讓我們的網頁變得更加美觀、吸引人。
上一篇css3能立體陰影