更改博客皮膚----自定義背景圖片


  大家申請完博客園后,打開博客,一進去就看到空白的博客皮膚,然后很多人就想更改博客皮膚,然后就選自己想要的皮膚。

可能有些人看到一個覺得滿意的就用上了,但是有些人怎么看都不滿意,或者有些人覺得這些皮膚很多人都用過了,然后不喜歡用跟別人一樣的皮膚,然后想自定義博客皮膚,特別是對背景圖片的要求,說不定看着一些充滿動力的背景圖片,然后就很有靈感的寫文章。

  很多朋友看到這個標題就想:自定義背景圖片不是很容易嗎?當然,如果你是在dreamweaver,記事本等編輯工具里的html樣式設置背景圖片相當容易,background-image: url(xxx),不過這些背景圖片都是本地里,如果你要在博客園里更好背景圖片,那就不是只簡單的用本地的背景圖片那么簡單了。

  在這里我就說明改一張背景圖片,想改其他的圖片等都類似,很簡單的步驟,不需要寫很多的代碼,不用從頭開始寫,也不用申請JS權限

  第一步:

      你先隨意選一個皮膚

    

 

  第二步:

      把禁用模板默認CSS的鈎去掉

  第三步:

      第三步就是寫少量的CSS代碼了,那么,你想換你本地的找片background-image: url(xxx),url后面到底寫什么呢?寫自己電腦上圖片的url地址?如果寫自己電腦上圖片的url地址,那就不行了,因為這是你電腦上的圖片,而你是要用在博客這個網上的,打開博客點擊鼠標右鍵,點審查元素,找到你背景圖片的位置,

這時候你看右邊有你的模板圖片背景url,不過它這個圖片是在網絡的文件夾中,這個時候想改成你想要的背景圖片,

 

那有什么辦法呢?當然,這里就會告訴你怎么做。

  第四步:

      這一步也就是最重要的一步。只有一個辦法能換到背景圖片,那就是把本地的照片上傳到這個博客園上,不過問題來了,怎么上傳?博客園這個網站沒有一個鏈接是可以上傳自己想放的照片,也沒有一個博客園數據庫讓你放照片。於是我就往這條思路走----上傳照片?我就想啊想,咦?上傳頭像不是也是上傳照片嗎?於是我就去嘗試。

  第五步:

      再打開一個博客園的網站,點擊修改頭像

      然后就放你喜歡的圖片(到時用在你的博客頂部的背景圖片),我在這里上傳一張

 

 

上傳完后點擊鼠標右鍵審查元素,找到頭像的代碼,這個時候你就可以看到你上傳圖片的路徑可以清楚的看到個人的網上文件夾里的圖片名稱,然后復制,去到頁面定制CSS代碼

敲下你的CSS代碼: 

.header {
background-image: url();
background-position: center;

}

 點擊保存就可以了。

然后就變成這樣:

 

 不過有個缺點就是這張背景的圖片大小不是很大,如果你拉伸就會變得模糊,除非你用高清圖片拉伸,這個問題有待探討。

或許我可能有一些出錯的地方,希望大家可以和我說說。

還有可能其他方法做到,大家可以一起討論這個問題。

我就說到這里,謝謝。

 

 

 

 

 

 

 

 

 

 

 

      

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM