金羽銀華

噗浪的獎勵制度，除了卡馬外，就是小徽章了～

從上傳大頭貼、發表噗文、註冊累計天數到卡馬值超過81的涅槃境界，

都會出現可愛的徽章作為獎勵的表徵～

點「如何獲得徽章」會跳出小視窗，可以看見共有三十枚徽章可以收集～ＸＤ

但是對於整體噗版的設計而言，這些五顏六色的徽章，可能太過華麗炫目了一點，

尤其是當你希望背景是簡潔清爽的時候～

如果你不在意這些徽章，或是不希望它們出現影響版面整體感，可以把它完全隱藏起來，

或是設定透明度變化，讓滑鼠移至徽章的時候再顯現：

[ 1 ] 隱藏小徽章

 /*完全隱藏*/

.award_bar,  /*徽章區*/
a.link_arrow, /*如何獲得徽章*/
.award_bar_mini .award_bar, /*個人小視窗徽章區*/
.award_bar_mini .award_bar div,
.award_bar_mini.on
{
filter:alpha(opacity=0) !important;
-moz-opacity:0 !important;
opacity:0 !important;
height:0 !important;
width:0 !important;
font-size:0 !important;
overflow:hidden;
zoom:1;
}

看，徽章不見了～

[ 2 ] 透明度變化

可以設定透明度，讓徽章淡淡地隱在背景中，等滑鼠移過去再清楚顯現：

語法：

/*透明度變化*/

.award_bar img
{filter:alpha(opacity=40) !important;opacity: 0.4 !important;zoom:1;}
.award_bar img:hover
{filter:alpha(opacity=100) !important;opacity:1 !important;zoom:1;}

[ 3 ] 透明度＋使用小圖

原本，徽章的大小可以用CSS來調整並設定，自從在個人資料視窗內出現小小徽章後，

噗浪變更了相關的CSS，分別以大圖和小圖來顯示，就無法僅用設定寬高來調整大小了......

不過，沒關係，只要找到小圖的連結位置，將原本大圖的CSS連結位置換成小圖就可以啦～

缺點是...每個徽章都是一串語法，有多少徽章就有多少串語法要放囉～XD

這樣一來，所有出現徽章的地方都會顯示小版的徽章了，還可以搭配透明度來處理～

語法：

.award_bar img  /*透明度變化*/
{filter:alpha(opacity=20) !important;opacity: 0.2 !important;zoom:1;}
.award_bar img:hover
{filter:alpha(opacity=100) !important;opacity:1 !important;zoom:1;}

.award_bar  /*緊密排排站*/
{
width:200px !important;
height:20px !important;
_height:1%;
padding:0;
margin-top:20px;
}
.award_bar div
{
padding:0 !important;
margin:0 !important;
width:20px !important;
height:20px !important;
}

/*徽章們*/
.cmp_1
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1194px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -848px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_100000_views
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -117px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10000_invites
{background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -172px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10000_plurks
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -227px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10000_views
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -282px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_1000_days
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -337px no-repeat;width:16px;font-size:1px;height:16px;
}
.cmp_1000_invites
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -392px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_1000_plurks
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -447px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_1000_views
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -502px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_100_days
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -557px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_100_invites
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -612px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_100_plurks
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -667px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_100_views
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -722px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10_days
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -777px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10_invites
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -832px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_10_plurks
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -903px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_11
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -958px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_12
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1013px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_13
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1068px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_14
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1123px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_15
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1178px no-repeat;width:16px;font-size:1px;height:16px;
}
.cmp_2
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1249px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_4
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1304px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_5
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1634px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_50000_comments
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1398px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_5000_comments
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1453px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_500_comments
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1508px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_500_days
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1563px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_50_comments
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1618px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_6
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1689px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_7
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1744px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_8
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1799px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_9
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1854px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_upload_profile_image
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1909px no-repeat;
width:16px;font-size:1px;height:16px;
}
.cmp_webcam_image
{
background:transparent url(http://statics.plurk.com/dfcea7c3cd5f2464c34f8e036656c1d7.png) 0 -1964px no-repeat;
width:16px;font-size:1px;height:16px;
}

選擇符合你想要的徽章呈顯方式，讓徽章們聽話吧～