創作內容

28 GP

小屋系統預設圖片更換教學 - PART 3

作者:淵│2007-09-05 00:54:37│巴幣:0│人氣:5776
看到好多人的小屋都弄得真是專業....
深深覺得我自己的頗為陽春="=




好啦,
我是門外漢慢慢摸索,
心得PO上來當教學,
大家加減著看:D




今天來教大家一個超級雞肋的圖片更換...



教學開始。

1.右邊那個
綠色的點,我想應該很多人都想換掉它吧...


2.請把CSS自訂面板打開

3.什麼都不要移,把下面
紅色框框圈起來的那一句打在第二行,

用文字敘述的話就是像下面這樣:


/*--------------------------整體頁面設定--------------------------*/
body{list-style:url(http://圖片網址);}/*右邊的項目圖示*/



照慣例,圖片網址要先另外上傳哦。
圖片不要搞的太大,小小一個放上去就可以很可愛了。


4.按『確定送出』


09/13新增:
以下由yannan1 (毀滅者) 補充

這點其實我在看別人的css之後(忘了是誰了),
就有看到可以在firefox上支援的語法了,
而且在ie上也行的通。

li{
BACKGROUND:url(http://pic.bahamut.com.tw/home/but_icon.gif) no-repeat;
}

上面這個是對所有li標籤有用的,
所以所有li標籤的圖都會由指定的圖片取代。

.post_list{
BACKGROUND:url(http://pic.bahamut.com.tw/home/but_icon.gif) no-repeat;
}

上面的語法是只有class取名為post_list的標籤才有用,
也就是右邊的那些前面有綠點的那幾行字。

ps.上面的圖片連結是在勇者小屋的某內定連結‧‧‧



也就是說,之前用我這篇教學的人,
可以把 body{list-style:url(http://圖片網址);}/*右邊的項目圖示*/ 這行刪掉,改成

.post_list{
BACKGROUND:url(http://圖片連結) no-repeat;
}

我測試過了,OK沒問題!!
引用網址:https://home.gamer.com.tw/TrackBack.php?sn=667737
All rights reserved. 版權所有,保留一切權利

相關創作

留言共 29 篇留言

流星雲★
不會啦!你的小屋有母愛(?)不不~是春天的戀愛的感覺。
最近過的不錯哦?(眨眼~~)

09-05 01:02

as1955
說教學文有如雨後春筍 您的教學可是圖文並茂 淺顯易懂 我推! ( ′▽`)-oGP

09-05 01:19

御風
真的滿讚的~~~~~~

09-05 01:22


路過發現找到寶
教學簡單又清楚
謝謝分享喔!

09-05 02:37

成小玉
感恩~多謝大大的教學^^

09-05 03:54

玲麗
淵姊姊~~~~幫我做一個~~~~(蹭過去)

09-05 09:30

威志
不過小弟使用火狐來觀看時,綠色小點依然存在,然後妳做的小花圖片會另外出現在小綠點的左邊
然後改用IE觀看時又會變正常.....偏偏我又是火狐的愛好使用者
不知能不能改善火狐和IE語法的相容性

妳的教學讓我學到很多,也希望妳能到我的小屋留個言或給個建議(小屋設計),謝謝啦^^~

09-05 09:56


啊真的嗎,因為我沒用過火狐...
還是謝謝你告訴我這點。09-05 10:11
渴求翅膀的貓
感動,終於不用被css弄死一堆腦細胞了(倒)

09-05 13:07

遺忘
推~造福人群@@

09-05 13:14

君翔
想要直接加好友了.... ( ′▽`)-oGP   

09-05 16:05

J i l l ~*
同樣方法弄了以後
原先的綠色珠珠還是在
變成新的圖案和舊的同時存在 = ="

09-05 16:11


那這樣我想這個語法可能是只能把原來的綠色圓點蓋過去而已...09-05 16:26
琉璃
會陽春嗎 @@" 我覺得很可愛啊---------

09-06 00:23

小屋因故停止更新
感謝~
GP&收藏~
(快去試試XD)

09-06 16:14

伊比魯斯
感謝教學

09-06 17:10

阿築
說真的,這麼多人在教我只看得懂你寫的,你的圖文並茂再加上清楚明瞭的解說,
簡直就是新手的救星,再再加上您小屋清新可愛不雜亂,多教一些 ^ ^

09-06 21:02

高木 碁伸駿
只有文字的教學都看不懂啦 還是一圖解千文最棒>///<

09-07 10:33

昨日夢醒今日醉
這篇我也要推回去~推

09-07 18:02

Glass
用力地給它推~~~~~~~~!

順便打包收藏唷 ^0^

09-08 19:44

~Ceylon錫蘭~
收藏去了!感恩啊~>口<

09-08 23:41

☜♀★初戀★♂☞
淵大~小綠點沒辦法完全拿掉嗎?
這樣有些圖不能用呢= =?

09-11 20:52


根據好幾個人跟我講,綜合起來的結果是,
這圖應該只是能把綠點蓋過去,所以你只能設能把綠點蓋過去的圖片而已..09-11 21:26
壞掉的熊貓
@@意思就是說只能用比他大的圖蓋過去對吧~

小弟之前有學...

可是全忘了>"< 要回去翻書了

11-07 23:08


你可以看一下我後面有用黑色字體補充的部分,
那個語法可以直接讓你的圖片取代綠點,
而不是只有蓋住而已11-07 23:09
深藍之痕
感謝分享

01-14 16:39

赫爾萊恩。小赫
多謝淵大~
成功了!!

02-04 18:50

小角落..
寫的太讚了~~感謝你的教學>Q<

02-13 16:20

婪祤ゞ゜
感謝淵姐的分享教學~~
我還把圖給換成動態的GIF檔的說
線在還在慢慢改造中

02-14 21:58

冰珞月
很詳細的解說唷
還是有圖片比較容易懂呢
非常感謝

02-18 00:17

起舞弄清影
感謝你的教學,我帶走哩^^

02-18 00:18


精華

08-21 19:25

歐西
太神手啦~

03-24 22:11

我要留言提醒:您尚未登入,請先登入再留言

28喜歡★houup 可決定是否刪除您的留言,請勿發表違反站規文字。

前一篇:小屋系統預設文字修改教學... 後一篇:小屋系統預設圖片更換教學...

追蹤私訊切換新版閱覽

作品資料夾

happy545晚上好~
歡迎來我的小屋看看喔~~xd看更多我要大聲說昨天19:26


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】