創作內容

49 GP

滑鼠游標輕鬆吃到飽 (圖文教學) ╰(≧(工)≦)╯

作者：Beatrice│2007-09-02 12:08:13│巴幣：0│人氣：9623

本文引用自此
本文引用自此

看到別人家有精緻可愛的滑鼠游標，是否心動了呢？但看看對部落格設計一無所知的自己，真不知道從何下手，想找一篇教學文來學，卻又怕太複雜而學不會，而感到無奈、挫折……

路邊熊：哪有這麼嚴重的啊？我打！

別擔心！這邊就編輯一篇完整且簡易的圖文教學，一次從「下載滑鼠游標」到「上傳滑鼠游標」，再到「編輯CSS語法」一次通通告訴你，讓你無負擔學習，也能夠輕鬆佈置小屋。 ^ 0 ^

【下載滑鼠游標】

通常用「Google」、「Yahoo!」搜尋器鍵入「滑鼠游標下載」就可以找到相當多資料，這邊引用apple0771昨日(8/1)推薦的「兔窩教學」提供給大家參考。

但記得！請大家一定要自行下載，別盜連網址，並感謝部落格主的用心。 ^ ^

一、進入兔窩教學部落格

樹上熊：廢話！當人家都笨蛋喔？我踹！

二、找到想要使用的滑鼠游標，對著它點左鍵一下進行下載

Ａ圖

Ｂ圖

【上傳滑鼠游標】

大部分的網路上傳空間沒有提供動態游標(*.ani)的上傳服務，會告知檔案格式不符/錯誤。如果，始終找不到適合的網路空間，不妨嘗試看看香港Yahoo!的GeoCities，這是一個完全免費的網頁製作空間，當然也可以上傳動態滑鼠游標的檔案。

一、進入Yahoo!GeoCities，並登入帳號密碼(可用台灣Yahoo!帳號密碼登入)

二、點選圖示中的連結簡單開啟空間

三、選擇一個空間主題，並輸入驗證碼後提交

四、按圖示中的連結進入個人網頁

五、點選【FTP傳輸或無痛上載功能】進入上傳頁面

六、按【瀏覽】找到要上傳的滑鼠游標後，再按下方的【上傳檔案】進行上傳。由於檔案大小只有有數K的關係，僅需要數秒的等待時間，可以說相當快速唷！

七、上傳結束後，右方會出現檔名並通知「成功上載」，這時就可以點【檔案總管】繼續

八、同樣在圖示中的位置，可以找到檔名右邊的【檢視】，先別急著點它。請對著它按滑鼠右鍵選擇【內容】。

九、會出現一個內容的方塊，裡面就有已上傳成功的滑鼠游標網址，在反白複製網址後，就可以編輯到CSS語法中了唷。

【滑鼠游標CSS語法說明】

以下是基本滑鼠游標的CSS：

body{cursor:url(滑鼠游標網址)}/*移到網頁時的滑鼠游標*/
a:hover {cursor:url(滑鼠游標網址)}/*移到超連結時的滑鼠游標*/

例如：

/*--------------------------整體頁面設定--------------------------*/

body{cursor:url(http://hk.geocities.com/OOXX/da2.ani)}/*移到網頁時的滑鼠游標*/
a:hover {cursor:url(http://hk.geocities.com/OOXX/eter.ani)}/*移到超連結時的滑鼠游標*/

/*----整體文字----*/

將剛剛複製好的滑鼠游標網址貼到引號"( )"內的位置就可以有美美的滑鼠游標了(若CSS的部分需要問題解答，不妨到sindsiona的兔窩逛逛唷！ <(≧(工)≦)/＊

相信你看完以上說明應該了解許多了，趕快親自動手試試看吧！
如果還有使用上的疑問或困難，歡迎留言，我們一起研究看看。

喜歡 49 收藏 175 引用留言推上首頁檢舉

引用網址：https://home.gamer.com.tw/TrackBack.php?sn=657378
Some rights reserved. 姓名標示-非商業性 2.5 台灣

相關創作

DIGSTA『人中之龍』模型發售總整理，以及SEGA STORE限定特典內容

BTC 減半預測二更

BTC 減半行情預測三更

AI繪圖│媽媽ｘ姊姊ｘ妹妹＆冰淇淋 #45

來寫吧！創作者向問卷 40 題（順便發公告）

留言共 72 篇留言

小超一世：
嗯嗯~善心的小熊又分享她玩Blog的心得了，
實際上小屋配置裡的"CSS"語法，是有很大的彈性，
給我們這些巴友使用，溺水熊寫的這篇就是Cursor的應用，
昨天我在咪咪的blog也看到捲軸的使用語法，
你們都是善心人士，謝謝你們的分享。

09-02 12:31

Beatrice：
又給小超人搶到頭香了!! <(￣︶￣)//
這東西算是昨天在家亂玩弄出來的，
想說今天有空寫，就分享給巴友了。09-02 12:44

111：
小希好棒=W=*

09-02 12:33

Beatrice：
兔兔才厲害咧!!09-02 12:45

玲麗：
好文推推推！有鬼在後面追（咦？）這篇我收走嚕 ^^

09-02 12:55

Beatrice：
留言回回回！轉頭看是誰（啥？）

請三日內食用喔。 ^__^y09-02 13:22

.：
看不太懂XD 改天花時間來研究好了ˇˇ

09-02 13:21

Beatrice：
大概是被篇幅嚇到了吧？

步驟真得很簡單的。09-02 13:23

板主のみぞ知るBS：
不錯唷，雖然我很懶得弄

09-02 14:08

Beatrice：
嗯 ~ 不用花太多時間，大概十分鐘就可以完成。09-02 14:20

＊嬌情～：
哈哈~~XD好棒好棒~~~可是我不會=////=

09-02 14:11

Beatrice：
提出來我們一起討論看看吧。：)09-02 14:21

Prof. S.Diophantus：
小希根兔兔的都好實用~

09-02 14:40

Beatrice：
你的都不實用，不逛了！ (被踹)09-02 15:17

瘋~柏：
小希好棒喔
簡單易懂
我都改好了呢>W<

09-02 14:41

Beatrice：
原來你喜歡神奇寶貝啊。09-02 15:18

板主のみぞ知るBS：
真的真的只是懶的用
以前大學的時候也是無聊自己去找語法弄網頁
像是背景、字體顏色、圖片連結、滑鼠游標、音樂播放等等
現在真的都不太想動手的說

09-02 14:53

Beatrice：
原來是這樣子~
而我剛好還在妳說的大學生階段。 (⊙(工)⊙)09-02 15:21

嘉戀：
改天來試試 >__<

09-02 15:09

Beatrice：
呵 ~ 感謝小優的雞皮囉。09-02 15:22

水云：
今天自己摸半天才會，想說要整理的，
沒想到小希搶先好幾步，飲恨啊！（喂）

小希很認真呢，真的做的很棒喔：）

09-02 15:22

Beatrice：
水水的家很漂亮耶！
主選單那邊我還不會用說，可以麻煩教一下嗎？ XD09-02 15:26

水靈雲兒：
這篇教學真的滿完整的~有圖片讓人看的更清楚^^

我收藏囉~雞皮接著~╰( ￣﹏￣)╯°(我丟！）

09-02 15:45

Beatrice：
是雞皮！吃掉。 (^ (工) ^)y 謝謝囉~09-02 16:05

阿築：
很詳細,順便收起來^^~

09-02 16:05

Beatrice：
記得要存放到冰箱唷，不然會臭。 (⊙(工)⊙)|||09-02 16:09

羅斯洛立安的小黃花：
寫的超詳細還圖文並茂
謝謝哩^O^

09-02 16:15

Beatrice：
過獎了！也謝謝妳的雞皮。
有幾個地方還想改進的說，
不過目前也不算差就是了。 ^ 0 ^09-02 16:19

Minnie：
謝謝大大的細心圖文教學，是否可以連結做分享^^?

09-02 16:16

Beatrice：
這份資料歡迎引用，分享給更多巴友。 ^___^y09-02 16:20

藏鏡咪咪：
原來你跟我一樣喜歡研究CSS...噗!今天我也PO了一篇說

09-02 17:41

Beatrice：
我對CSS並不了解，頂多也只會用一點點…

--
今天有到你的小屋走，可是字都看不太清楚 >"<09-02 18:36

涼絆：
我找到網址了，不過語法要貼在哪裡呀@@?

要怎麼把以下是基本滑鼠游標的CSS：

body{cursor:url(滑鼠游標網址)}/*移到網頁時的滑鼠游標*/
a:hover {cursor:url(滑鼠游標網址)}/*移到超連結時的滑鼠游標*/

貼到我巴哈的部落格上面呀

要貼在哪裡@@?

有勞大大解答惹

09-02 18:05

Beatrice：
到自己的小屋首頁，按下「佈置小屋」，進去之後找看看右邊的地方，會有一個「自訂CSS」的按鈕，就從那進去將語法貼上去編輯。09-02 18:35

小美老師：
昨天收到熊熊的教學網頁，立刻鞭策凱凱幫我做了^^
謝謝熊熊....

09-02 18:19

Beatrice：
呵 ~小美的滑鼠游標很可愛唷!!

--
辛苦凱凱了。 m(_ _)m09-02 18:37

再說下去我打斷你鼻樑：
我家已經OK~感謝兔子跟希姐提供...

用完的問題已解決!!

09-02 21:21

Beatrice：
呵 ~ 你還是自己把問題解決了。 ^___^y

那隻彩虹上的兔子很可愛 ~ XD09-02 21:24

◤ カオス ◢：
看起來真是有些複雜 ~ @@

不過看起來還滿有趣了呀~~

我也來做一個看看好嚕~!! (明後天~~)

感謝大大再次熱心的分享喔!! (請接受GP!)

09-02 22:08

Beatrice：
因為貼圖的關係，篇幅看起來有點長吧， (⊙(工)⊙)
其實一點也不難，樓上就有人說看完之後，一下子就改好了。 ^ ^

加油囉!!09-02 22:20

Ｊｏｅ：
滿不錯的教學^^
不過當初還真沒想到巴哈會推出有支援CSS語法的功能

09-02 22:41

Beatrice：
謝謝 ~

小屋現在還是beta版，相信未來還會推出更多功能。 > W <09-03 05:08

HAru：
非常實用！

09-03 00:44

Beatrice：
非常感謝！09-03 05:09

淡染初夏：
請問一下為什麼我每次改完後，上方進版圖就會消失呢＠＠？

09-03 01:10

Beatrice：
嗯 ~
這麼問我也不曉得你的問題出在哪，可以留個操作步驟嗎？09-03 05:09

甦甦：
很實用的文章~收藏起來>ˇ<+

09-03 01:30

Beatrice：
要收進冷藏，並三日內食用完畢，不然會腐臭唷。 (啥)09-03 05:10

認真就酥了：
收起來!謝謝啦~

09-03 05:19

Beatrice：
這麼早起收文，真是辛苦啦!09-03 05:36

淡染初夏：
呃....就
/*--------------------------整體頁面設定--------------------------*/

body{cursor:url(游標網址)}/*移到網頁時的滑鼠游標*/
a:hover {cursor:url(游標網址)}/*移到超連結時的滑鼠游標*/

網址放上去後按確定送出...重新整理...游標改了...上方進版圖就變白色了＝ˇ＝

然後再重新放回進版圖...游標又變回原本的XD

09-03 09:34

Beatrice：
在CSS裡面檢查看看有沒有多打了什麼符號或者指令，順便找到下面這串，試試從這裡直接把招牌的網址放上去(如果找不到上傳的網路空間，可以看看我另一篇青蛙貼圖的教學)。

/*-----------------------最上方顯示大圖-----------------------*/
.banner{
background: url(招牌網址) repeat;
height:120px;
padding-left:20px;
padding-top:15px;
}/*小屋上方主圖*/09-03 09:45

長貓不喵：
哎呀呀呀呀一▽一 (偷帶走)

09-03 09:38

Beatrice：
什麼？一皿一 (我揍)09-03 09:46

Glass：
老闆，打包外帶　=　=+

09-03 09:58

Beatrice：
外帶請自備購物袋 ~ (⊙(工)⊙)09-03 10:12

焱雁：
好棒喔>ˇ<
我也要試著玩玩看XD
這篇就包走囉 XDDD

09-03 10:00

Beatrice：
加油囉 ~ <(￣▽￣)>09-03 10:13

淡染初夏：
我放棄了＝ˇ＝

還是一樣。。游標跟背景語法你的跟兔我都參考用過在重新弄過你剛剛說的直接從CSS改進版圖....

還是一樣沒版圖>///<

09-03 11:06

Beatrice：
Orz

你的語法可以用信箱傳給我，測試一下嗎？09-03 11:08

淡染初夏：
不過還是很謝謝你的教學︿︿

09-03 11:07

Beatrice：
安啦！過了阿飄月就好了。 (被毆)09-03 11:09

無限挑戰：
實用!!

09-03 11:25

Beatrice：
感謝!!

--
(￣(工)￣) 我好像越來越懶了09-03 11:27

御風：
這麼好的文章不推太可惜

09-03 11:27

Beatrice：
hi ~ 好久不見唷。09-03 11:30

淡染初夏：
寫信怕你沒看到＝ˇ＝

直接ＰＯ在這好了＠＠

/*--------------------------整體頁面設定--------------------------*/
/*背景*/

BODY {
background-image: url(http://dye.mychat.to/bg_img/sq/dye_sq_0369.gif);
}

/*游標*/

a:hover {
cursor:url(http://ashine0118.myweb.hinet.net/wing.ani)};
BODY {
cursor:url(http://ashine0118.myweb.hinet.net/angel.ani);
}

就是這樣＝ˇ＝

09-03 12:02

Beatrice：
我拿這段預覽一下，確定是沒問題，招牌還在。
截圖：http://img294.imageshack.us/img294/1962/picprobui2.png
我想這應該是之前回應中講的部分有寫錯；
還有，招牌的圖片網址也能借我測試一下嗎？09-03 12:13

淡染初夏：
/*-----------------------最上方顯示大圖-----------------------*/
.banner{
background:(http://img98.imageshack.us/img98/8701/88002781qa1.jpg)repeat;
height:120px;
padding-left:20px;
padding-top:15px;
}/*小屋上方主圖*/

09-03 12:21

Beatrice：
網址前面少打了一個"url" (￣(工)￣)
然後圖片本來是 750×121 ，我幫你改750×120了，
拿去貼貼看吧。

/*-----------------------最上方顯示大圖-----------------------*/
.banner{
background: url(http://img250.imageshack.us/img250/9611/88002781qa1ma9.jpg) repeat;
height:120px;
padding-left:20px;
padding-top:15px;
}/*小屋上方主圖*/09-03 12:43

淡染初夏：
喔耶>///< 終於有了。。太感恩了。。

>///<

09-03 12:48

Beatrice：
好啦～那記得自己去兔兔那邊說一聲，免得又讓她花力氣了。09-03 12:51

威爾伊斯麥海德：
感謝分享，收藏起來~ˇ

09-03 14:28

Beatrice：
要多放幾包乾燥劑，不然很容易就發霉了。09-03 15:56

米洛：
好棒好棒~有圖解耶!! ^^

09-03 14:40

Beatrice：
事實上今天有一張圖，
不知道為什麼就掛掉，
然後還趕緊重新上傳。 ≡_____≡09-03 15:58

as1955：
好文！　不過我的自製游標做好哩　所以我收！　ＸＤ

09-03 14:54

Beatrice：
呼！真得要收？小心會弄髒你的小屋喔。09-03 16:00

風的名字：
謝謝你^^

好漂亮喔~

09-03 15:33

Beatrice：
呵 ~ 謝謝。 ^_______^//09-03 16:00

(⁎⁍̴̛ᴗ⁍̴̛⁎)：
ＹＡ　～希我愛死你了>////< (啾

以前就超想用滑鼠遊標QQ 這篇也收走囉>////<

09-03 17:54

Beatrice：
動作真快＠_____＠是一隻粉紅喵。09-03 18:59

蒼燄：
辛苦了>\\\\<

09-03 18:16

Beatrice：
呵 ~ 謝謝你的雞皮。 (吃掉)09-03 18:59

cfevenfish：
圖文並茂教學萬歲！

09-03 18:16

Beatrice：
其實…

我想看別人製作影音教學。 (被踹)09-03 19:00

再說下去我打斷你鼻樑：
辛苦了~下次也做個熊掌游標吧?還蠻可愛的耶Q///Q

會不會被炸飛?(要求過多)

09-03 19:20

Beatrice：
雨與熊掌不可兼得啊！

--
好像是"魚"才對。09-03 19:30

美聲♀淚小喵：
你最棒了~!!

09-03 19:25

Beatrice：
淚淚也最棒了~!! (⊙ w ⊙)y09-03 19:31

再說下去我打斷你鼻樑：
雨跟熊傻傻分不清楚(?

叫熊好了(不要亂決定￣▽￣)

總之你的杯子熊很可愛喔0.0

09-03 19:54

Beatrice：
(￣▽￣) 都可以啦，反正也都有人這樣叫了。09-03 20:22

沁〃娃娃：
謝謝你簡單的教學模式

讓我終於會了

接下來剩下怎把被麵換成所有背景了

我真笨呀呵呵

09-03 19:59

Beatrice：
這是背景的語法：

body {background-image: url(圖片網址);}/*以圖片為背景*/
body {background-color:(色碼);}/*以顏色為背景*/09-03 20:27

戀上小胖龍：
先收藏起來好了等有時間在研究~"~
感謝希的教學....

09-03 20:20

Beatrice：
要冷藏喔……09-03 20:28

再說下去我打斷你鼻樑：
問熊熊ˇˇ...

PHOTOIMPACT能夠做進版圖嗎?

容量會超過近版圖的大小嗎?

恩....如果希望文字能跟背景合2為1的話~有方法嗎?一直找不到0ˇ0

09-03 20:43

Beatrice：
PhotoImpact當然可以呀，這是一套功能齊全的影像管理軟體，
而擔心容量超過限制，它也有壓縮檔案的功能，還算不錯用唷！

但事實上，不壓縮也沒關係，直接到自訂CSS裡面編輯就好。=0=09-03 20:52

真‧半仙：
感謝大大囉　。。

我也是剛剛才用好　＝　＝　。。

現在才跑來回　。

我不行了　（死）

09-03 22:40

Beatrice：
天啊！你竟然半夜還在弄……

下次早點休息吧！09-04 05:42

戀戀-晴若藍：
我是第101則留言嗎XD

yahui:此篇已收精華區~~

09-04 11:18

Beatrice：
呵歡迎唷 !!

記得要上進冰箱裡唷。09-04 12:34

Prof. S.Diophantus：
背景的語法應該要放在哪呢，因為我改一直沒變A_A

09-04 20:51

Beatrice：
你翻一下我的精華區 > 巴宅教學 > 如語娃娃的教室，屋主整理得相當詳細。
PS.看過後也別忘了感謝屋主的用心！09-05 15:08

嘉戀：
雨爺爺家這裡好漂亮 >__<

09-06 19:47

Beatrice：
因為這裡是廁所改建的 (啥)09-06 20:04

mimi：
大大的教學真實用
感謝大大^^

09-10 18:20

Beatrice：
不客氣 ^ ^09-11 06:23

草莓泡芙：
想幫小屋換上可愛的游標
看到這篇超開心的~大大真用心

對不起，
根據你的登記資料，你未有足夠的年齡開設 Yahoo! GeoCities 帳戶

唔...好想撞牆自殺Q_Q"

09-11 05:40

Beatrice：
(⊙(工)⊙)!!

事實上，香港Yahoo!只是最多人用，非唯一空間。妳可以試試看在Google中搜尋「ani」，花一點時間還可以找到其它的網路上載空間。09-11 06:26

美琳：
雨大你好，跟你說一下
美琳在部落閣中也有引用這篇文章
網址：http://home.gamer.com.tw/blogDetail.php?owner=anna0599&sn=645
另外，這篇美琳也收藏囉~^^

09-25 14:52

Beatrice：
那篇整理，再加個文字顏色，會更美觀喔。09-25 15:30

安生魘夢：
這是我難得會的語法＝Ｗ＝
帶回家嚕
http://home.gamer.com.tw/blogDetail.php?owner=kkaakkaa2435&sn=461
這個順便交一下．．．．．．．．．．

10-07 11:49

Beatrice：
過去看過，
基本上你寫的設定，巴哈都把它給鎖了，所以沒效。10-07 17:10

天才小釣獸：
可是我用台灣yahoo部落格，我上傳圖片都沒出現耶，怎麼會這樣？有什麼解決方法？

10-08 17:12

Beatrice：
請用香港的或者日本的，感謝。10-08 19:39

IVY：
謝謝您，蠻實用的，謝謝分享

10-24 23:02

Beatrice：
不客氣 @@ 有相關問題可以繼續留言10-25 09:11

赫爾萊恩。小赫：
嗚嗚＞＜
我的游標都沒有出現！！
到底是哪裡出了問題呀～！？
麻煩大人幫我看一下～感恩唷＞＜
/*游標*/
a:hover{
cursor:url(http://hk.geocities.com/hydegackt00/Edward.ani);
}
BODY{
cursor:url(http://hk.geocities.com/hydegackt00/u-m-ryoma00.ani);
}

02-05 12:32

Beatrice：
到大廳問問看吧 @@02-06 06:02