金羽銀華

這陣子，噗浪真是一直在做一些小變動啊～

新增了「自訂表情」的功能，「換行」的功能，「刪除線」等的格式功能～

另外，還把分享影音圖文的預設樣式也變更了～

圖片的框框加上圓角跟底色，顯得有些多餘且突兀...

部落格與影音分享的轉貼連結，也多了顯示圖片、文字連結、左列框線等的樣式設定～

而原本轉噗會出現的那列轉噗者名單，則好像已經拿掉了。要看自己轉噗的訊息，現在點時間軸右下方"說讚&轉噗訊息"就可以看到了。

當個人檔案填寫滿90%，就會出現自訂表情的功能列：

點新增會跳出自訂視窗：

這些許許多多的小更動，也都有相應的css可以自訂改變它呈現的樣式，上面的圖片有些是已經改好後的樣子，想看看噗浪原本預設的樣貌？先暫時清除掉自訂樣式內容就可以看見了～ ^ ^

接下來就列出相關的語法項目，請需要的朋友試著自己修改看看～

/*======================== 表情選單 ========================*/

#emoticon_selecter   /*選單背景*/
{
    border-color:#ccc !important;
}
#emoticon_selecter .upper_arrow  /*向上箭頭符號*/
{
    background-image:none !important;
}
#emoticon_selecter #emoticons_tabs ul  /*顯示所有選單*/
{
    overflow:visible !important;
}
#emoticons_show  /*圖片背景*/
{
    padding:4px;
    padding-top:10px!important;
    border-top:0 !important;
    width:422px !important;
}
#emoticon_selecter img, #emoticon_selecter a:hover img {border:0 !important;}
#emoticon_selecter #emoticons_tabs {padding:6px 0px 0 !important; }
#emoticon_selecter #emoticons_tabs   /*標籤列*/
{
    background:none !important;
    border-color:#fff !important;
}
#emoticon_selecter #emoticons_tabs li    /*標籤*/
{
    background:#eee !important;
/*555 url(http://statics.plurk.com/c4d8bf5acae8b6e882a1d0cb1c6734fc.png) repeat-x*/
    border:0 !important;  /*c1d0d7*/
    background:#eee !important;
    font-size:83% !important;
}
#emoticons_tabs ul li a   /*連結*/
{
    color:#888 !important;  /*8099ad*/
    font-weight:normal !important;
}
#emoticon_selecter #emoticons_tabs li.current   /*正選標籤底色*/
{
    background:#fbfbfb !important;
}
#emoticons_tabs ul li.current a  /*正選連結*/
{
    color:#222 !important;   /*133d5f*/
}
#emoticons_show .red_link  /*額外 連結*/
{
    background:none !important;
    font-weight:normal;
    font-size:11px;
    color:#ccc !important;
    text-decoration:none !important;
}
.emo-manager  /*自訂表情列*/
{
    background-image:none !important;
    background:#111 !important;
    padding: 0 !important;
    margin-top:-10px !important;
    border:0 !important;  
}
.emo-manager .emo-pool-paging
{
    padding-top: 8px !important;
}
.emo-manager .emo-public-pool .emo-wrapper,
.emo-manager .emo-public-pool .emo-wrapper:hover
{
    border:0 !important;  
}
#emoticons_show input.orange-but    /*自訂表情新增按鈕*/
{
    background:#333 !important;
    border-color:#111 !important;
    font-size:12px !important;
}
.emoticons_my .add-emoticon-panel div.popup   /*新增視窗*/
{
    background:#111 !important;
    border-color:#333 !important;
    font-size:11px !important;
    color:#fff !important;
    width:340px;
}
.emoticons_my .add-emoticon-panel input.col-right,
.emoticons_my .add-emoticon-panel input.col-right:focus
{
    background:#333 !important;
    border-color:#222 !important;
    font-size:11px !important;
    color:#fff !important;
    width:200px !important;
}
.emoticons_my .add-emoticon-panel .col-left
{
    width:auto !important;
    margin-left: 10px !important;
}
.emoticons_my .emo-manager-message,    /*自訂表情說明*/
.emoticons_my .emo-manager-message-small
{
    color: #777777;
    font-size:11px !important;
}

/*-----影音圖片移除外框與底色-----*/

.plurk a.pictureservices img,
.plurk a.pictureservices:hover img,
.youtube img, .youtube:hover img
.video img, .video:hover img,
.pictureservices img, .pictureservices:hover img
{
    margin-top: 0px !important;
    padding: 0px !important;
    background: none !important;
    border:0 !important;
    -moz-border-radius:0px !important;
    -khtml-border-radius:0px !important;
    -webkit-border-radius:0px !important;
}

/*-----影音圖文分享連結區塊-----*/

.plurk a.oembed, .plurk a.oembedmeta, a.ex_link div.blog, .plurk a.youtube.video
{
    background:none !important;
    border-color:#7be !important;
}

懷念以前貼上影片連結時，單純只出現縮圖，滑鼠移至才會出現說明視窗的樣子嗎？

使用下列語法可以隱藏多出的連結文字跟框線：

/*-----把影片連結字藏起來-----*/

.plurk a.youtube.video
{
    font-size:0px !important;
    text-decoration:none !important;
    border:none !important;
}

使用後像這樣：

調整看看，瞭解各部份語法對應呈現的區塊與方式吧