在網頁設計中,經常會用到圖片的背景,如何讓圖片鋪滿整個屏幕是一個常見的需求。這可以通過CSS來實現。
body{ background-image: url("example.jpg"); background-position: center center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; }
以上代碼的解釋如下:
background-image
:指定背景圖片的URL,也可以指定為相對路徑。background-position
:指定背景圖片的位置,這里設置為居中。background-repeat
:指定圖片是否平鋪,這里設置為不平鋪。background-attachment
:指定圖片相對于瀏覽器窗口的位置,這里設置為固定。background-size
:指定背景圖片的大小,這里設置為鋪滿整個屏幕。
使用以上代碼可以讓圖片鋪滿整個屏幕,適用于響應式網頁設計。同時,可以根據不同的需求進行調整,如將位置調整到左上角,圖片大小調整為100%等。
下一篇css圖片錯位擺放