1. 程式人生 > >新增背景圖片注意事項

新增背景圖片注意事項

背景圖片新增格式background-image: url(圖片地址);

我們的目錄結構,css資料夾,img資料夾與HTML檔案再同級目錄下,新增背景圖片是圖片地址寫的有問題會報錯,也會出現無法應用的狀況。

1、在css檔案中

background-image: url(img/navbar-bg.jpg);/*有錯誤*/background-image: url(/img/navbar-bg.jpg);/*無法應用*/

正確用法:

background-image: url(../img/navbar-bg.jpg);

2、用在Html檔案的<style>中

background-image

: url(../img/navbar-bg.jpg);/*有錯*/

background-image: url(/img/navbar-bg.jpg);/*無法應用*/

正確用法:

background-image: url(img/navbar-bg.jpg);

background-image: url(./img/navbar-bg.jpg);