Café de Poète

AvatarJeter, le poète de CANCER. a personal Website creator since 1996, always looking for the best way of designing.

Plurk自訂時間軸背景圖的方法

Plurk本身有提供簡單的變更佈景方式,也有第三方專門設計的佈景提供套用,不過如果只是想要換掉時間軸上面的圖來耳目一新一下,其實並不困難,首先你要有一個可以上傳圖片的空間,無論是相簿或是FTP都可以,我個人的最佳建議是使用Picasa,因為Picasa不像無名相簿有限制外連的問題,而且又是整合在Google的服務底下,使用起來也很方便。

接著請注意下面這段CSS語法:
#timeline_holder { background: #ffffff url(這裡放圖片的位址) no-repeat bottom left; }
紅色文字的部份請拷貝來源圖片的位址取代,以Picasa為例,在圖片顯示的右側功能列便有提供圖片本身的位址:



而圖片的尺寸,Plurk由瀏覽器上方邊界到可顯示的範圍最底部的高度是388px,寬度的部份就看螢幕解析度而定,或是你可以跟一樣採取圖片靠左,右邊則以底色延伸的方式。語法中第一部份的16進位碼屬性即是背景色,你可以使用ColorSchemer - Online Color Scheme Generator來查詢想要使用的顏色,而語法中的bottom與left則是圖片對齊的方式,可以使用的有top、right、bottom、left四個值,假設我想要改為對齊右上方,背景色黑色,範例如下:
#timeline_holder { background: #000000 url(這裡放圖片的位址) no-repeat top right; }
no-repeat指的則是背景圖片的重複拼貼方式,這裡指的是不重複拼貼,你也可以使用橫向拼貼,就不需要考慮底色的部份,只要把no-repeat改為repeat-x即可。

而變更背景圖的方式,便是在Plurk頁面中,點選個人的大頭貼來開啟Profile settings視窗,接著點選自訂外觀,將編輯好的語法貼到「進一步運用 CSS 來自訂您的個人頁面」底下的欄位中,按下存檔並更新即可。

2 意見:

AK 提到...

謝謝~正是我想找的XDDD

Internet business at home automated system 提到...
網誌管理員已經移除這則留言。