非常感謝~ ☆二度空間部落格(柏憲)☆ 發表分享~
滑鼠指標靠近改變訂閱圖(圖片應用篇),錯誤修正
對各位引用的格友說聲抱歉 ! 一時疏忽,語法上的缺失,造成不良動作,還好熱心朋友回報,得以修正,感謝各位,先前的發文有引用的朋友,請複製下列語法文章做修正,謝謝! ↓↓
滑鼠指標靠近改變訂閱圖(圖片應用篇)
謝謝訂閱圖(圖二) | 歡迎訂閱圖(圖一) |
http://connie-ee.t35.com/601/02/24-1.gif | http://connie-ee.t35.com/601/02/24.gif |
http://connie-ee.t35.com/601/02/27-1.gif | http://connie-ee.t35.com/601/02/27.gif |
http://connie-ee.t35.com/601/02/30-1.gif | http://connie-ee.t35.com/601/02/30.gif |
http://connie-ee.t35.com/601/02/34-1.gif | http://connie-ee.t35.com/601/02/33.gif |
http://connie-ee.t35.com/601/02/36-1.gif | http://connie-ee.t35.com/601/02/36.gif |
http://connie-ee.t35.com/601/02/39-1.gif | http://connie-ee.t35.com/601/02/39.gif |
http://connie-ee.t35.com/601/02/42-1.gif | http://connie-ee.t35.com/601/02/42.gif |
http://connie-ee.t35.com/601/02/48-1.gif | http://connie-ee.t35.com/601/02/48.gif |
http://connie-ee.t35.com/601/02/54-1.gif | http://connie-ee.t35.com/601/02/57.gif |
http://connie-ee.t35.com/601/02/57-1.gif | http://connie-ee.t35.com/601/02/45.gif |
http://connie-ee.t35.com/601/02/60-1.gif | http://connie-ee.t35.com/601/02/60.gif |
http://connie-ee.t35.com/601/02/63-1.gif | http://connie-ee.t35.com/601/02/63.gif |
http://connie-ee.t35.com/601/02/66-1.gif | http://connie-ee.t35.com/601/02/66.gif |
http://connie-ee.t35.com/601/02/51-1.gif | http://connie-ee.t35.com/601/02/51.gif |
http://connie-ee.t35.com/601/02/69-1.gif | http://connie-ee.t35.com/601/02/69.gif |
http://connie-ee.t35.com/601/05/20-2.gif | http://connie-ee.t35.com/601/05/20-1.gif |
http://connie-ee.t35.com/601/05/19-2.gif | http://connie-ee.t35.com/601/05/19-1.gif |
以上圖片隨意組合(圖片來源 : 感謝 e e http://tw.myblog.yahoo.com/ee-blog/archive?l=f&id=43 特別製作)
/*訂閱圖-連結區塊-訂閱圖位置(自行做調整)-訂閱圖顯示寬高-訂閱圖網址 (圖一) - 框線*/
div#btnsbsrb_nologin a,div#btnsbsrb a {display:block;position:absolute;top:10px;left:91%; width:90px;height:33px;background:url(訂閱圖網址) no-repeat; border-left:4px double #FF0000; border-right:4px double #FF0000; border-top:4px double #FF0000; border-bottom:4px double #FF0000; }
/*滑鼠指標靠近改變訂閱圖 (圖二) - 框線*/
div#btnsbsrb_nologin a:hover,div#btnsbsrb a:hover,div#btnsbsrb_nologin a:active,div#btnsbsrb a:active {background:url(答謝訂閱圖網址) no-repeat;border-left:4px double #00FFFF; border-right:4px double #00FFFF; border-top:4px double #00FFFF; border-bottom:4px double #00FFFF;}
PS : 圖一與圖二的框線可以不加入,如果有使用此段語法,建議框線使用不同顏色,以示區別及變化
兩組語法都要放在自訂中,才有變化,而且兩張圖不能相同
語法中的 top:10px;left:91%; width:90px;height:33px; 為參考值,依需要自行調整
邊框語法解說 :
border-left:4px double #00ffff; border-right:4px double #00ffff; border-top:4px double #00ffff; border-bottom:4px double #00ffff;
left = 左邊框
right = 右邊框
top = 上邊框
bottom = 下邊框
double = 雙線 (請參考框線條樣式)
4px = 框線粗細像素值 (一般使用在1~5之間)
#ff00ff = 框線顏色色碼 (可搭配個人使用的背景配色,請參考色碼表)
框線條樣式 : ( 無、點線、實線、雙線、溝線、脊線、嵌入線、浮出線 )
相對應語法 : none︱ dotted|solid︱ double︱ groove︱ ridge︱ inset︱ outset
自訂樣式檢圖說明→ http://xs320.xs.to/xs320/07421/W6-4.jpg
色碼表應用 : (注意 : 有些數字色碼無支援應用在奇摩部落格當邊框顏色,無支援的貼上只會顯示灰色)