Navy主題如何在頁首添加一張圖片可以http://www.ikk.me/這樣子頂部添加背景圖片

他的代碼是【點擊查看】

回復內容：

Navy主題如何在頁首添加一張圖片可以http://www.ikk.me/這樣子頂部添加背景圖片

他的代碼是【點擊查看】

看了下代碼，就是給 section 加了個 background，為了使固定寬度的圖片填充各分辨率的屏幕，將其設置為 cover：

HTML 部分：

...

CSS 部分：

.billboard {

background: url('../img/mirai.jpg') center center repeat-x;

background-size: cover;

}

我對該網站所用的建站流程不是很了解。但是找出圖片的來源還是很簡單的。

首先，加載了一張圖片的前提是該圖片被請求。所以查看請求的圖片，第一個就是該圖片，名字是mirai.jpg.

然后，將該圖片導入頁面的代碼可能出現在三處，html中，js中和css中，html和js經過搜索都搜不到mirai。那么對所有的css進行排查，發現costoms.css中包含這么一段：

.billboard {

background: url('../img/mirai.jpg') center center repeat-x;

background-size: cover;

}

于是在控制臺中執行$('.billboard')選擇到一個對象，及網站標題所在的section。換句話說，只要通過css將網站標題的背景圖設成該圖片即可。

順便一提，該圖片是遠大于網頁標題的，所以作者通過對標題設置了很大的padding來保證圖片可以完全顯示而不被裁剪或壓縮。

相關標簽：php

本文原創發布php中文網，轉載請注明出處，感謝您的尊重！