Blog 板


LINE

首先要先感謝 huanson 大大給我關鍵性的觀念指導才得以讓我在此分享這篇心得。 <0> --- 先貼上完成後網站給各位參考: http://virsitilityj.blogspot.com/ 這篇文章要討論的是如何自訂自已喜歡的圖片在各篇獨立的文章, 我本來的想法是要給各篇文章評分, 讓我/來參觀的人可以篩選出一些比較有可看性的文章。 以下是基本做法教學: 登入後,在自已的首頁右上角按"自訂"->"修改HTML", 在畫面中間有個 "口展開小裝置範本" 打勾, 搜尋 "/* Posts" 這段文字, 用以找出負責處理文章的程式碼,把下面的程式加進去,以後比較好整理。 這是我用的範本的情況,如果其他的範本寫法和我的不一樣, 請各位自已要記住把程式碼加到哪裡去了,以後要修改才不會搞半天。 找到之後就要來新增自訂的背景了。 --以下為程式碼-- .star1-body { background:url("圖片網址") no-repeat 400px .5em; } --以上為程式碼-- .star1-body - "." 在 html 語法裡面是新增一個 class 的意思,後面就是你要創建的 class 的名稱,可以自已訂。 background:url("圖片網址") - 填入自已的圖片網址。 no-repeat - 設定圖片不重複貼在背景上。 400px - 因為我的 blog 寬度是 1000px,所以我把自訂的背景圖貼在左邊文章列的 400px 處,這邊多試幾次就可得到最佳位置。 .5em - ...這邊我是照程式碼內建的抄下來的,所以不太清楚,只知道砍掉圖片就顯示不 出來了,麻煩知道的大大指點了。 最後要記得加上 ";"。 如果你有三張圖,就得加入三組上面的程式,所以加完就會有 star1-body, star2-body, star3-body 三組 class(以我的三組名稱為例), 接著,在編輯新文章時,切換到 "修改html" 模式, 在本文的最前面和最後面用 div 包住, 例: 未更改的本文: 今天天氣好 好得不得了 可以去郊遊 加入背景圖的程式碼: <div class='star1-body'> 今天天氣好 好得不得了 可以去郊遊 </div> 完成貌: http://virsitilityj.blogspot.com/ --- 其實這不只可以用來做文章評等,還能改成這篇文章的心情(喜怒哀樂的圖), 圖示化標籤(Label)...等, 相信這只是基礎的土法練鋼技,還有大大有更簡便的方法, 只是提供個簡單的修改讓不會程式的大家能美化自已的部落格, 如果有什麼問題也可以提出來一起討論。 謝謝(鞠躬~ -- ***大金剛*** 三支女大十一金三支女大十一金三支女大十一金三支女大十一金三支女大十一金 金一十大女支三金一十大女支三金一十大女支三金一十大女支三金一十大女支三 三支女大十一金三支女大十一金三支女大十一金三支女大十一金三支女大十一金 --



※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 122.123.85.125
1F:推 huanson:給推! 因為我覺得原PO的想法很特殊, 好像還沒看過 10/29 21:18
2F:→ huanson:有人這樣作, 所以我就幫原PO實現願望. 同時原PO也很厲害 10/29 21:19
3F:→ huanson:我剛好電腦壞了 所以寫得很簡略 沒想到他竟然看懂了 10/29 21:20
4F:推 gunner:推你們的交流~~~ 10/30 00:11
5F:→ versitility:只是有點程式概念+查資料而已 說不上厲害啦 "囧> 10/30 22:27
※ 編輯: versitility 來自: 122.123.81.10 (10/31 01:31)







like.gif 您可能會有興趣的文章
icon.png[問題/行為] 貓晚上進房間會不會有憋尿問題
icon.pngRe: [閒聊] 選了錯誤的女孩成為魔法少女 XDDDDDDDDDD
icon.png[正妹] 瑞典 一張
icon.png[心得] EMS高領長版毛衣.墨小樓MC1002
icon.png[分享] 丹龍隔熱紙GE55+33+22
icon.png[問題] 清洗洗衣機
icon.png[尋物] 窗台下的空間
icon.png[閒聊] 双極の女神1 木魔爵
icon.png[售車] 新竹 1997 march 1297cc 白色 四門
icon.png[討論] 能從照片感受到攝影者心情嗎
icon.png[狂賀] 賀賀賀賀 賀!島村卯月!總選舉NO.1
icon.png[難過] 羨慕白皮膚的女生
icon.png閱讀文章
icon.png[黑特]
icon.png[問題] SBK S1安裝於安全帽位置
icon.png[分享] 舊woo100絕版開箱!!
icon.pngRe: [無言] 關於小包衛生紙
icon.png[開箱] E5-2683V3 RX480Strix 快睿C1 簡單測試
icon.png[心得] 蒼の海賊龍 地獄 執行者16PT
icon.png[售車] 1999年Virage iO 1.8EXi
icon.png[心得] 挑戰33 LV10 獅子座pt solo
icon.png[閒聊] 手把手教你不被桶之新手主購教學
icon.png[分享] Civic Type R 量產版官方照無預警流出
icon.png[售車] Golf 4 2.0 銀色 自排
icon.png[出售] Graco提籃汽座(有底座)2000元誠可議
icon.png[問題] 請問補牙材質掉了還能再補嗎?(台中半年內
icon.png[問題] 44th 單曲 生寫竟然都給重複的啊啊!
icon.png[心得] 華南紅卡/icash 核卡
icon.png[問題] 拔牙矯正這樣正常嗎
icon.png[贈送] 老莫高業 初業 102年版
icon.png[情報] 三大行動支付 本季掀戰火
icon.png[寶寶] 博客來Amos水蠟筆5/1特價五折
icon.pngRe: [心得] 新鮮人一些面試分享
icon.png[心得] 蒼の海賊龍 地獄 麒麟25PT
icon.pngRe: [閒聊] (君の名は。雷慎入) 君名二創漫畫翻譯
icon.pngRe: [閒聊] OGN中場影片:失蹤人口局 (英文字幕)
icon.png[問題] 台灣大哥大4G訊號差
icon.png[出售] [全國]全新千尋侘草LED燈, 水草

請輸入看板名稱,例如:Soft_Job站內搜尋

TOP