[公告] 痞客豐年終!萬元禮券限量送~[公告] 第一屆痞客邦金點賞登場!2014年最有影響力的部落格即將揭曉[公告] 痞客邦新服務上線 每日星座運勢測算【得獎名單公佈】[公告] 痞客邦應用市集全新改版![公告] 痞客邦「應用市集」新 App 上架-iFontCloud Professional
版權所有+保留所有權利_+_+_
© 2010-2014 Created by Be Myself Inc. 如我協力創意工作室
**版權說明**
-- 我們提供與設計的噗版CSS內容僅供個人自用,請勿改製再分享或用於商業用途 --
((請勿將全部或部份內容直接取用當作自己的設計))
-- 除了個人噗版自用外(修改請註明原CSS碼出處),其它使用方式均未授權,還請務必注意,勿侵權喔~--

**版權說明**

我們提供與設計的噗版CSS內容僅供個人自用,
歡迎個人噗友學習改成最適合自己的樣式(請註明原CSS出處),
請勿改製再分享或使用於商業性質等其他用途,
請勿將全部或部份內容直接取用當作自己的設計,
除了個人噗版自用外,其它使用方式均未授權,
還請務必注意,勿侵權喔~

在玩浪的過程中,
因為使用上的習慣,加上特殊設定的需要,所以通常套用了版型,一定有一些需要動手改的部分,
像是字體加大、改變字型、輸入文字的欄位加高、或是每一則回應列表的區域拉長,以及便於閱讀的設定等等。

索性整理了一份常用的CSS,最基本一定要換用的選項,然後進一步,將所有會用到的噗浪CSS項目整理一份出來,這樣,只要有常備的「噗浪CSS集成」概略,就能方便查詢並上手自由運用了~

---------------------------------------------------------------------
{ 我的常用CSS列表 }
---------------------------------------------------------------------

NO1.
/*搜尋面板背景透明*/
.plurkaction {clear:both;padding:8px;}.plurkaction,#toggle_tab li.tt_selected,#more_options_link{
border: 0px solid #FFF;
background:  transparent; }


因為搜尋功能面板是噗浪後來新增的功能,所以在套用一些之前的版型的時候,常常會發現中間有一塊不協調的區域。這時,只要在自訂外觀中加入上面那段CSS,就能讓整體背景一致了。

 

NO2.
/*噗文輸入區加高*/
textarea#input_big.content {
height:100px;
}


加上這一小段,就能讓中央輸入文字發噗的區域加高,使在輸入文字的過程中能夠一次看見全文。


NO3.
/*個人照片縮小與回復大小*/
#profile_pic{border:0 ; width: 80px;}
#profile_pic:hover {width:auto}


希望個人的代表圖不用那麼大,看起來很突兀,那就使用這段程式碼,讓它變小,而滑鼠移過去想看仔細時再恢復噗浪的原始設定值大小。


NO4.
/*噗:未打開前*/
.plurk_cnt {
background: #fefefe; /*背景*/
border: 1px solid #000000; /*框線*/
font-size: 13px; /*字級數*/
letter-spacing: .1em  /*字距*/
font-family: century gothic ; /*字型*/
line-height: 15px;  /*行距*/
}

通常噗浪上的訊息列字的級數都很小,所以為了方便閱讀起來舒服些,就讓它放大一些、個人化、貼心一點吧!


NO5.
/*噗:打開後回應列表*/
#input_small {
height:50px;    /*回應輸入區塊加高*/
}
.plurk_box .list {
height: 300px;    /*列表區塊加高*/
}
.info_box {
-moz-border-radius: 0px 0px 8px 8px;  /*下方圓角設定*/
border-right: 1px solid #79683e;
}

對一則訊息有興趣,點進去看,往往有很多筆回應資料,但閱讀的區域就這麼小~要一直捲動頁面很累人~那就加高列表區塊吧!

想要輸入回應的文字,這個區域也是可以大些的,就使用回應輸入區塊加高的設定。

習慣看MAC使用界面的人,像我,不太喜歡四四方方的訊息方塊,又不希望全部圓角化顯得太可愛,那就讓列表的最下方有圓角的弧度,像MAC選單一樣,有些變化也不賴(只適用於FireFox火狐瀏覽器)。



一般的版型,經過了上面五個步驟,對我來說就適用很多。當然,想要進階控制每一個頁面選項的CSS呈現,讓它完全特製化,就需要進一步研究每一個區塊的設定~

---------------------------------------------------------------------
{ 噗浪CSS集成---不定期整理更新中 }
---------------------------------------------------------------------


/* USE_DARK_ICONS */  /* 頁首編輯區小圖用深色 */ 

/* ------------------------------------PART(一)------------------------------------ */
/* ------------------------------------畫面佈景------------------------------------ */

body, html
{
background: url(); /*背景圖網址*/
background-repeat: no-repeat; /*背景圖不重複*/
background: #000106; /*背景色*/
font-family:  ; /*頁面字型*/
font-size:; /*字級數大小*/
}


/* 標題 */
#page_title
{
color: #;
}


/* ------------------------------------PART(二)------------------------------------ */
/* ------------------------------------時間軸主題------------------------------------ */
#timeline_holder
{
background: transparent; /*背景:透明*/
border: none; /*框線去除*/
}


/* 隱藏噗浪LOGO */
#dynamic_logo ,#logo img
{
filter:alpha(opacity=0) ;
-moz-opacity:0;
opacity: 0;
}


/* 每日分隔軸 */
.div_inner,.day_bg .div_inner
{
border: 0; /*框線*/
opacity: 0.2; /*背景:透明度*/
width: 0px;  /*線條粗細*/
font-size:10px; /*字級數大小*/


.day_start, .day
{
font-weight: normal;
color: #FEA6CC !important;
}

.day_start .bottom_start, .day_start .div_start
{
margin-top: -1px;
margin-left: 1px;
color: # !important;
text-align: left;   
}


/* 底線 */
#bottom_line
{
font-size: 11px;
color: #;
background: none; /*背景去除*/
border: 0; /*框線*/
border-top:1px solid  #;
border-bottom:1px solid #;/*線條樣式*/
}

.bottom_start , .bottom_end
{
color:#;
font-weight:bold;
font-size:11px ;
}

.bottom_line_bg
{
background: transparent;
font-size: 11px;
color:#;
border: 1px solid #;
}

.time
{
margin:0 ;
padding:0 ;
font-size:17px;
color: #;
}


/* 每日分隔線和底線背景透明 */
#bottom_line, .day_bg .div_inner, #time_show
{
background: transparent;
}



/* ------------每一則訊息: 未打開前------------ */
.plurk_cnt
{
background: #; /*背景色*/
border: 1px solid #; /*框線*/
padding: 1px; /*間距*/
letter-spacing: .1em  /*字距*/
font-family: century gothic ; /*字型*/
line-height: 15px;  /*行距*/
-moz-border-radius: 8px; /*圓角*/
filter: alpha(opacity=80); opacity: 0.8; -moz-opacity: 0.8; /*透明度*/
}

a.name /*名稱*/
{
color: #;
font-weight: bold;
font-family: Century Gothic;
}

.text_holder
{
color: #;
font-family: Century Gothic;
font-size: 12px;
}

.p_img /*圖片*/
{
border: 1px solid #; /*框線*/
}


/* ------------每一則訊息的透明度變化------------ */
.plurk_cnt
{
opacity: 0.7; /*滑鼠移過去前*/
}
.plurk_cnt:hover
{
opacity: 0.9; /*滑鼠移過去後*/
}
td_cnt
{
opacity: 0;
}
.text-holder
{
opacity: 0;
}


/* ------------每一則訊息的連結樣式------------ */
.plurk a.ex_link
{
color:#;
font-weight: bold;
text-decoration:normal;
}

.plurk a.ex_link:hover
{
color: #;
font-weight: bold;
border-bottom: 0px solid #;
text-decoration:normal;
}

a:link
{
color: #;
text-transform: normal;
}

a:visited, a:active
{
color: #;
text-transform: normal;
}

a:hover
{
border:0;
color: #;
text-transform: normal;
}


/* ------------每一則訊息: 打開後------------*/
.plurk_box .plurk_cnt
{
background: # !important;
border-bottom: 1px solid #;
color: # !important;
border-top: 0px solid #;
padding-top: 3px;
padding-bottom: 3px;
}

.plurk_box .list
{
background: # repeat scroll top left;
border-color: #;
border-radius: 8px;
border-width: 0px;
color: # !important;
}

.list  /*列表圓角*/
{
-moz-border-radius: 0px 0px 6px 6px;
-khtml-border-radius: 0px 0px 6px 6px;
-webkit-border-bottom-left-radius: 6px;
-webkit-border-bottom-right-radius: 6px;
}

#input_small
{
height: 100px; /*回應區加高*/
color: # !important;
border: 1px solid #;
background: #; !important;
}

textarea#input_small  /*回應區*/
{
background: # !important;
border: 1px solid #;
color: # !important;
}

.plurk_box .list  /*訊息區列表*/
{
height: 300px; /*加高*/
}

.info_box /*回應欄位*/
{
-moz-border-radius: 0px 0px 8px 8px; /*左右下方圓角*/
border-right: 1px solid #; /*右框線*/
color: # !important;
background: #e0e9ee;       
border:0;
font-size: 11px;
}

/* 最近的回應 */
.plurk_box .caption
{
border:0;
font-size: 11px;
color: #;
background: #;   
}

.plurk_box
{
-moz-border-radius: 6px;
-khtml-border-radius:6px;
-webkit-border-bottom-left-radius: 6px;
-webkit-border-bottom-right-radius: 6px;
}

.plurk_box .mini_form
{
background: #;
color: #000000 !important;
border-right: 1px solid #;
border-left:0;
border-bottom:0;
border-top:0;
}

.mini_form .char_updater
{
color: # !important;
background: #;
}


/* 刪除儲存編輯等文字 */
.manager .action
{
color:#;
margin-left:5px;
}
.manager a:hover
{
text-decoration: none!important;
}
.manager .cancel
{
color:#;
margin-right:5px;
}
.manager .delete
{
color:#;
margin-right:5px;
}
.unmute
{
color:#!important;
}


 /* 訊息區使用者回覆暱稱變色 */
.list .highlight_owner .td_qual a
{
color:# !important ;
}


 /* 訊息區使用者回覆文字變色 */
.list .highlight_owner .text_holder
{
color:# !important ;
font-weight: bold; /*粗體*/
}


/* 讓訊息列表換行和加底色 */
.list .plurk_cnt .td_qual
{
position: absolute;
width: auto;
overflow: visible;
}
.list .plurk_cnt .td_cnt .text_holder
{
margin-top: 1.5em;
padding: 0.4em;
width: auto !important;
background: #; /*底色*/
margin-left: 0.5em;
}

.list .plurk_cnt 
{
line-height: 120%; /*加大列表的行距*/

.list .plurk_cnt tr
{
border-bottom: 1px solid #; /*加底線*/
}
.list .plurk_cnt .td_cnt
{
font-size: 120%; /*加大字體20%*/
}
.plurk_cnt tr:hover
{
background-color: #; /* 游標移過去加底色 */
}


/* ------------回覆數字------------ */
.dots .inner /*中間的...*/
{
border:1px solid #;
border-left: 0;
background-color: #;
}
.response_count /*回覆數字*/
{
background-color:#;
padding: 1px 5px;
-moz-border-radius: 3px;
border-bottom:1px solid #;
border-right:1px solid #;
}
.new .response_count /*新回覆數字*/
{
background-color:#;
color:#fff !important



/* ------------更新通知------------ */
#updater
{
background-color:# ;
border:1px solid # ;
top:409px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
padding:5px 10px;
border-top:0
}

#alert_beacon
{
color:#;  /*Alerts通知*/
margin:0 2px;
}

#updater #noti_np #noti_np_text
{
color:#;
}

#updater #noti_np a
{
color:#;
}

#updater #noti_re #noti_re_view #noti_re_text
{
color:#;
}
#updater #noti_re #noti_re_view a
{
color:#;
}


/* ------------每一則噗對應的時間顯示------------ */
#time_show
{
background:url() left top no-repeat; /*背景圖*/
background-position:-10px 0px; /*位置*/
text-align:right;
width:50px;
height:50px;
position:absolute;
}


/* 日升月移圖 */
.evening,.night,.day,.morning
{
color:# !important
background:url(http://statics.plurk.com/ada9286581b4d3b04769f31c32957edf.png) no-repeat 0 0;
_background:url(http://statics.plurk.com/9a0d3f41579deec72d78e94e6a96e0f8.gif) no-repeat 0 0;
}

.evening,.night
{
color:# !important
background-position:-65px 0;
}



/* ------------所有plurk , 我的plurk , 私密plurk------------ */
#filter_tab
{
-moz-border-radius:8px 8px 8px 8px;
-webkit-border-radius: 8px;
border: 0 !important;
margin-top: 1px;
}

#filter_tab .off_tab
{
background: #;
color: #;
border:1px solid # !important;
border-top:0  !important;
padding:3px 5px !important
}

#filter_tab a.off_tab
{
color:#;
border:0 !important;
background:none ;
background-color:#;
-moz-border-radius-bottomleft:3px ;
-moz-border-radius-bottomright:3px ;
}

#filter_tab a.off_tab:hover
{
color:#;
filter:alpha(opacity=90) ;
-moz-opacity:0.9;
opacity: 0.9;
border:0 !important;
}

#filter_tab a.filter_selected
{
color:#;
background-color:#;
border:0 !important ; 
-moz-border-radius-bottomright:3px;
-moz-border-radius-bottomleft:3px;
padding:5px 10px  !important;
letter-spacing: 1px;
}

#filter_tab a.filter_selected:hover
{
filter:alpha(opacity=90) ;
-moz-opacity:0.9;
opacity: 0.9;
}

/* ------------------------------------PART(三)------------------------------------ */
/* ------------------------------------主控台主題------------------------------------ */

/* 搜尋面板背景透明 */
.plurkaction
{
clear:both;
padding:8px;
}
.plurkaction,#toggle_tab li.tt_selected,#more_options_link
{
border: 0px solid #;
background:  transparent;
-moz-border-radius:8px; /*圓角*/
}


/* 發噗區背景 */
#plurk_form
{
margin-top: 40px;
padding: 10px;     
background: #07222c;
border:0px solid  #fff;
color: #cacecd;
}
#pane_plurk
{
border: 0px solid #918e79;
background: #07222c;
color: #cacecd !important;
}
#toggle_tab li
{
background: #07222c;
color: #cacecd !important;
}


/* ------------噗輸入區------------ */
textarea#input_big, textarea#input_permalink
{
background: url(http://圖片網址); /*背景圖*/
background: #000106; /*背景色*/
background: transparent; /*背景透明*/
border: 1px solid #ffffff; /*框線*/
color: #000000 !important; /*輸入文字顏色*/
}
textarea#input_big.content
{
height:100px; /*輸入欄位加高*/
}
textarea#input_big {/*width:450px*/} /*寬度固定*/


/* 更換發噗按鈕 */
img[src="http://static.plurk.com/button/plurk.png"] /*原按鈕透明*/

filter:alpha(opacity=0);
-moz-opacity:.0;
opacity:.0;
}

.submit_img /*替換按鈕圖片網址*/
{
background: transparent url(http://圖片網址) no-repeat scroll top left;
height: 38px;
padding-left: 82px;
width: 0px;
overflow: hidden;
margin-top: -40px;
}


/* 尚餘字數 */
.char_updater
{
color:#;
}

.char_updater.highlight_light
{
color: #;
background: transparent !important;
}

.char_highlight
{
background: transparent !important;
border-radius: 2px;
padding-left: 2px;
color: # !important;
}

/* 私密、語系和選項 */
#more_options
{
background: transparent;
border: none;
color: #;
}
#more_options a#more_options_link
{
background: #;
border: none;
-moz-border-radius: 10px;
}
#more_options #plurk_to
{
background: transparent;
border: none;
color: #;
}
#more_options #more_options_holder
{
border: none;
background: transparent;
}


/* ------------控制面板------------ */
#plurk-dashboard
{
background:none; /*背景*/
margin:0 ;
padding:0;
border:0 ;
color:#;
font-size: 11px; /*字級數大小*/
line-height: 120%; /*行距*/
filter: alpha(opacity=80);
opacity: 0.8;
-moz-opacity: 0.8;
-moz-border-radius: 10px; /*圓角*/
}

#plurk-dashboard a
{
color: #;
text-decoration: underline;
border:0;
}

#plurk-dashboard a:hover
{
color: #;
text-decoration: none;
border:0;
}

.segment-content
{
border:1px solid #;
margin-right: 3px;
-moz-border-radius:8px;
height:300px;
}


#plurk-dashboard h2  /*面板標題*/
{
color: #;
font-family:century gothic;
font-size: 20px;
border-bottom: 0px solid #;
}

#dash-stats h2, #dash-friends h2, #dash-fans h2  /*各區標題*/

color: #;
font-size:20px;
line-height:125%;
text-align:left;
border:0;
font-weight: none;
}


/* 控制面板區的透明度變化 */
#plurk_form , .dash-segment  /*滑鼠移過去前*/
{
filter:alpha(opacity=20) ;
-moz-opacity:0.2;
opacity: 0.2;
}
#plurk_form:hover , .dash-segment:hover  /*滑鼠移過去後*/
{
filter:alpha(opacity=75) ;
-moz-opacity:1;
opacity: 1;
}


/* ------------個人自介------------ */
#profile_pic
{
border: 0;
width: 120px; /*個人照片縮小*/
}
#profile_pic:hover
{
width:auto; /*滑鼠移過去回復原圖片大小*/
}

#dash-profile /*自介區*/
{
background: #;
border:0;
padding: 10px;
color: #;
line-height: 16px;
}

#full_name  /*姓名*/
{
color: #000;
font-size:17px;
}

#span_years , #m_or_f  /*年齡性別*/
{
font-size: 11px;
color: #;
}

#location /*地點*/
{
color: #;
}

p#relationship_container  /*關係*/
{
background: #;
color: #;
border:0;
padding: 10px;   
}

p#about_me /*關於我*/
{
background: # ;
border:0px solid  # ;
color: # ;
margin:2px;
padding: 10px;
text-align:left;
}


/* ------------統計項目------------ */
#karma
{
color: # ; /*卡馬:顏色*/
}

.karma_hover
{
color: # ;
}
.karma_arrow

filter:alpha(opacity=0);
-moz-opacity:.0;
opacity:.0;
}

.cmp_karma_up
{
background:transparent url(/static/icons/icons_png.png) 0 -28px no-repeat;
width:8px;
height:10px;
margin-top: 10px;
}


#dash-stats /*項目*/
{
background: # ;
border:0px solid  #;
color: #;
padding-top: 5px;
padding-bottom: 38px;
text-align: center;
}

#dash-stats table td
{
color: #; /*數值*/
}


/* ------------朋友區------------ */
#dash-friends
{
color: #;
background: #;
border: none; 
width: 210px;
height: 306px;
filter: alpha(opacity=70);
opacity: 0.7;
-moz-opacity: 0.7;
line-height: 18px;
padding: 2px;
}

#dash-friends a
{
color: #;
}

#dash-friends h2
{
text-align: left;
font-size: 20px;
font-weight: bold;
color: #;
background: none;
border-bottom: 3px solid #;
}


/* 粉絲區 */
#dash-fans
{
color: #;
background: #;
border: none; 
width: 210px;
height: 306px;
filter: alpha(opacity=70);
opacity: 0.7;
-moz-opacity: 0.7;
line-height: 18px;
padding: 2px;
}

#dash-fans a
{
color: #;
}

#dash-fans h2
{
text-align: left;
font-size: 20px;
font-weight: bold;
color: #;
background: none;
border-bottom: 3px solid #;
}



/* 朋友粉絲圖 */
.friend_holder
{
margin-bottom: 4px;
}
.friend_holder table
{
margin-left: auto;
margin-right: auto;
}
.friend_holder .user_link
{
height:25px!important;
width:25px!important;
}  
.friend_holder img
{
width:25px;
height:25px;
}


/* 朋友粉絲圖片設透明度 */
#dash-friends-pics .user_link, #dash-fans-pics .user_link
{
filter: alpha(opacity=70); opacity: 0.7; -moz-opacity: 0.7;
}
#dash-friends-pics img, #dash-fans-pics img
{
filter: alpha(opacity=70); opacity: 0.7; -moz-opacity: 0.7;
}


/* 朋友粉絲區域設透明度 */
#dash-friends, #dash-fans
{
opacity: 0.1;
filter: alpha(opacity=10);
}


/* 追蹤朋友粉絲按鈕 */
.friend_man.add_follow, .friend_man.remove, .friend_man.add_friend, .friend_man.pending
{
-moz-border-radius: 6px 6px 6px 6px;
-khtml-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;  /*圓角設定*/
background: #000;
color: #fff !important;
}


/* 封鎖使用者按鈕 */
.friend_man.block
{
background: #000000 repeat scroll top left; /*背景色*/
border-color: #000000 #000000 #000000 #000000; /*框線色*/
-moz-border-radius: 4px 4px 4px 4px;
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
border-width: 1px 2px 2px 1px; /*圓角設定*/
}


/* 分享plurk按鈕 */
#sharePlurk
{
width: 203px;
}
#sharePlurk div
{
width: 180px;
}
#sharePlurk_url{
width: 100px;
}


/* 奬勵小圖示 */
.award_bar
{
height: 50px;
}


/* ------------------------------------PART(四)------------------------------------ */
/* ------------------------------------頁首頁尾------------------------------------ */

#top_login /*登入*/
{
height: 20px;
}

#top_login a
{
border:0;
font-weight: bold;
text-decoration: normal;
color: #;
}

#top_login a:hover
{
border:0;
text-decoration: normal;
color: #;
}


#top_bar #edit_link  /*編輯*/
{
background-color:#FFFFFF;
color:#000000;
-moz-border-radius:2px;
padding:0 5px;
}

#top_bar #edit_link:hover, #reply h2
{
color: #FFFFFF;
font-weight:bold;  /*粗體*/
}

#reply  #reply_box
{
background: #FFFFFF;
}

#reply h2
{
background: #FFFFFF;
}

#reply #reply_box_holder
{
background: #FFFFFF;
}


/* 頁首左上方 */
#top_bar a
{
color: #FFFFFF;
font-weight: regular;
text-transform: normal;
border:0;
}

#top_bar a:hover
{
color: #;
background: transparent;
font-wright: regular;
text-transform: normal;
border:0;
}

#top_bar .content  a:hover
{
color:#;  
text-transform: normal;
}

#top_bar .content  a#edit_link
{
background:transparent;
padding-bottom:1px;
color:#FFFFFF; 
text-transform: normal;
}

#top_bar .content  a:hover#edit_link
{
color:#FFFFFF; 
text-transform: normal;
}



/* 頁尾 */
#footer
{
color: #FFFFFF;
}
#footer a
{
color: #FFFFFF;
border-bottom:1px solid #FFFFFF;  /*底線*/
font-weight: bold;  /*粗體*/
}

#footer a:hover
{
color: #FFFFFF;
border:0;
text-decoration: underline; /*底線*/
font-weight: bold;  /*粗體*/
}


/* ------------------------------------PART(五)------------------------------------ */
/* ------------------------------------小視窗與工具------------------------------------ */

/* 影音分享圖片 */
.youtube img,.pictureservices img
{
border: none; /*去除框線*/
opacity:.6;
filter: alpha(opacity=60); /*透明度*/
}
.youtube:hover img,.pictureservices:hover img
{
border:none; /*去除框線*/
opacity:1;
filter: alpha(opacity=100); /*滑鼠移過去恢復*/
}


/* 工具視窗 */
.tooltip_cnt
{
background: #;
border:1px solid  #;
color: #;
padding:5px;
margin-top:1px;
font-size:11px;
}

.AmiTT_main b
{
color: #;
font-weight:bold;
}

.AmiTT_main
{
color: #;
line-height:1.2;
border-top: 1px solid #;
position:absolute;
text-align:left;
width:209px;
z-index:2000;
}


/* 下拉選單箭頭符號 */
.cmp_tooltips-down
{
height: 17px;
background: transparent url() no-repeat scroll left top;
}


.cmp_tooltips-up
{
height: 17px;
background: transparent url() no-repeat scroll left top;
}


/* 使用者小視窗*/
.AmiMenu.info_menu
{
background: #;
border:1px solid  #;
color: #cacecd;
}

.AmiMenu.info_menu .block
{
background:#;
}

.AmiMenu.info_menu td.on, .AmiMenu.info_menu .user_info.on
{
background: #;
}

.AmiMenu.info_menu .separator
{
background: #;
}

.AmiMenu.info_menu .user_info.on b
{
color: #;
font-weight: bold;
}


/* 語助詞:黑色系 */

.q_freestyle {
background: #000000;
border-right: 1px solid #1E1D1F;
border-top: 1px solid #0E0D0F;
border-bottom: 1px solid #1E1D1F;
border-left: 1px solid #0E0D0F;
color: #fff !important;

}.q_loves {
border-top: 1px solid #BF1717;
border-left: 1px solid #BF1717;

border-right: 1px solid #8F0808;
border-bottom: 1px solid #8F0808;
color: #ffffff;
background: #B20C0C;
}
.q_likes {
border-top: 1px solid #BF2F32;
border-left: 1px solid #BF2F32;
border-right: 1px solid #AF0A0D;
border-bottom: 1px solid #AF0A0D;
color: #ffffff;
background: #CB2728;
}
.q_shares {
border-top: 1px solid #BF5F5F;
border-left: 1px solid #BF5F5F;
border-right: 1px solid #9F3B3B;
border-bottom: 1px solid #9F3B3B;
color: #ffffff;
background: #A74949;
}
.q_gives {
border-top: 1px solid #5F0C0C;
border-left: 1px solid #5F0C0C;
border-right: 1px solid #3F0000;
border-bottom: 1px solid #3F0000;
color: #ffffff;
background: #620E0E;
}

.q_hates {
border-top: 1px solid #3F3F3F;
border-left: 1px solid #3F3F3F;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
color: #ffffff;
background: #111111;
}
.q_wants {
 border-top: 1px solid #A1BF5F;
border-left: 1px solid #A1BF5F;
border-right: 1px solid #809F3B;
border-bottom: 1px solid #809F3B;
color: #ffffff;
background: #8DB241;
}

.q_wishes{
border-top: 1px solid #67AF2B;
border-left: 1px solid #67AF2B;
border-right: 1px solid #4A8F11;
border-bottom: 1px solid #4A8F11;
color: #ffffff;
background: #5BB017;
}

.q_needs {
border-top: 1px solid #A1BF5F;
border-left: 1px solid #A1BF5F;
border-right: 1px solid #839F45;
border-bottom: 1px solid #839F45;
color: #ffffff;
background: #7A9A37;
}

.q_will {
border-top: 1px solid #BF839C;
border-left: 1px solid #BF839C;
border-right: 1px solid #9F5976;
border-bottom: 1px solid #9F5976;
color: #ffffff;
background: #B46D89;
}

.q_hopes {
border-top: 1px solid #F67FFF;
border-left: 1px solid #F67FFF;
border-right: 1px solid #C540CF;
border-bottom: 1px solid #C540CF;
color: #ffffff;
background: #E05BE9;
}

.q_asks {
border-top: 1px solid #AA8BDF;
border-left: 1px solid #AA8BDF;
border-right: 1px solid #825FBF;
border-bottom: 1px solid #825FBF;
color: #ffffff;
background: #8361BC;
}

.q_has {
border-top: 1px solid #8F8F8F;
border-left: 1px solid #8F8F8F;
border-right: 1px solid #4F4F4F;
border-bottom: 1px solid #4F4F4F;
color: #ffffff;
background: #777777;
}

.q_was {
border-top: 1px solid #7F7F7F;
border-left: 1px solid #7F7F7F;
border-right: 1px solid #3F3F3F;
border-bottom: 1px solid #3F3F3F;
color: #ffffff;
background: #525252;
}

.q_wonders {
border-top: 1px solid #5373BF;
border-left: 1px solid #5373BF;
border-right: 1px solid #31519F;
border-bottom: 1px solid #31519F;
color: #ffffff;
background: #2E4E9E;
}

.q_feels {
 border-top: 1px solid #53A7DF;
border-left: 1px solid #53A7DF;
border-right: 1px solid #2380BF;
border-bottom: 1px solid #2380BF;
color: #ffffff;
background: #2D83BE;
}

.q_thinks {
border-top: 1px solid #99C3DF;
border-left: 1px solid #99C3DF;
border-right: 1px solid #5F98BF;
border-bottom: 1px solid #5F98BF;
color: #ffffff;
background: #689CC1;
}

.q_says {
background: #000;
border-right: 1px solid #1E1D1F;
border-top: 1px solid #0E0D0F;
border-bottom: 1px solid #1E1D1F;
border-left: 1px solid #0E0D0F;
color: #fff !important;
}

.q_is {
border-top: 1px solid #DF8453;
border-left: 1px solid #DF8453;
border-right: 1px solid #CF6A33;
border-bottom: 1px solid #CF6A33;
color: #ffffff;
background: #E57C43;
}

.qual_menu .q_shares{
color: #ffffff !important;
border-top: 1px solid #3F2F2B !important;
border-left: 1px solid #3F2F2B;
border-right: 1px solid #0F0B09;
border-bottom: 1px solid #0F0B09 !important;}

.share_menu{
border-top: 1px solid #3F2F2B !important;
border-left: 1px solid #3F2F2B !important;
border-right: 1px solid #0F0B09 !important;
border-bottom: 1px solid #0F0B09 !important;

color: #ffffff !important;

 font-size:16px;}

.mini_menu .share_menu{
border-top: 1px solid #3F2F2B; border-left: 1px solid #3F2F2B; border-right: 1px solid #0F0B09; border-bottom: 1px solid #0F0B09;
color: #ffffff !important;  font-size:12px;}

.share_menu .on{
border-top: 1px solid #3F2F2B; border-left: 1px solid #3F2F2B; border-right: 1px solid #0F0B09; border-bottom: 1px solid #0F0B09;
background-color:#8d0000;
color:#FFF !important;}

.q_video,.q_link{
border-left:1px solid #ffffff !important;}

---------------------------------------------------------------------
{ End }
---------------------------------------------------------------------

**版權說明**

我們提供與設計的噗版CSS內容僅供個人自用,
歡迎個人噗友學習改成最適合自己的樣式(請註明原CSS出處),
請勿改製再分享或使用於商業性質等其他用途,
請勿將全部或部份內容直接取用當作自己的設計,
除了個人噗版自用外,其它使用方式均未授權,
還請務必注意,勿侵權喔~

 

概略整理出如上的列表,
取用需要的部分(通常換背景、換主要與次要顏色就很夠用囉~),
就可以簡單組合成適用自己的專屬浪型~


持續研究噗浪CSS中~


我的噗浪:http://www.plurk.com/66660000/invite

Posted by M6 at 痞客邦 PIXNET 留言(418) 引用(0) 人氣()


open trackbacks list Trackbacks (0)

留言列表 (418)

Post Comment
  • 逆子
  • 想請問一些修改的事情

    不好意思我想請問一下
    我想要再我的噗浪上面新增一些小圖示
    (這是別人的噗浪範例")http://www.fileden.com/files/2007/11/21/1597394/546.PNG
    上面那兩個圈起來的地方
    請問要怎麼修呢?
    我記得我有看過連左邊那個都可以改成一般gif的
    以及loding的那張圖片好像也可以改
    不過我對語法並不了解
    煩請大大替我解答了
    謝謝
  • (1)啤酒桶圖的位置是每一"日",有太陽(或月亮)和時間的是每一則噗的"時",兩者的語法如下:

    /*時間顯示圖標*/
    #time_show {background:url(http://) left top no-repeat;
    background-position:-0px 20px;text-align:right; width:50px; height:50px;position:absolute;} /*時*/

    .day_bg .div_inner {
    background:url(http://) no-repeat bottom;
    width: 100px;border: none;} /*日*/

    "http://"的地方請放入圖檔的網址。


    (2)loading圖的語法:
    /*更換loading圖*/
    #div_loading .cnt {
    background:transparent url(http://) no-repeat scroll center top !important;
    margin-top:140px;} /*主頁面loading圖*/

    .loading img {height:0;width:0;}
    .loading {
    background:transparent url(http://) no-repeat scroll center
    center !important;
    margin-top:30px;
    } /*每一則噗中的loading圖*/


    請參考囉~ ^ ^

    M6 replied in 2009/07/31 21:20

  • WW
  • 請問一下
    一開始的噗浪 朋友那一欄 一般都是2x4的
    不過我看到有些人的噗浪是圖片縮小 然後是3x4以上
    請問要怎麼用呢??
  • 可以加上以下語法控制圖的大小和排列:

    /*朋友粉絲圖*/
    .friend_holder { margin-bottom: 4px; }
    .friend_holder table { margin-left: auto; margin-right: auto; }
    .friend_holder .user_link{ height:25px!important;width:25px!important; }
    .friend_holder img{ width:25px; height:25px; }

    其中"25px"就是圖片大小的值,可自行調整。

    會排到3行是因為看別人的噗,登出後看自己的噗也是3行喔!
    這是噗浪預設。登入後自己的噗朋友粉絲圖就是2行。

    M6 replied in 2009/08/01 12:50

  • ww
  • 抱歉 還有個問題是
    [編輯],[通知裡面數字],發噗區的[Plurk]和[搜尋] 字的顏色哪裡改呢?
    感謝

  • 語法如下:

    /*編輯*/
    #top_bar .content a#edit_link{color:#FFF;} /*編輯文字顏色*/
    #top_bar .content a:hover#edit_link{color:#8fcfee;}/*滑鼠移過去改變顏色*/

    /*Alerts通知數字*/
    #alert_beacon{color:#999;font-size:11px;margin:0 2px;}

    /*發噗區標籤*/
    #toggle_tab{border: none; background: none;} /*背景及框線*/
    #toggle_tab li{color: #FFF; } /*標籤字顏色*/
    #toggle_tab li.tt_selected{color: #FFF;} /*正選用的標籤字顏色*/

    M6 replied in 2009/08/01 13:10

  • 逆子
  • 不好意思我主頁面loading改不成功"
    請問是不是有什麼其他的語法會影響"
  • 可以告訴我你的噗浪帳號嗎?我幫你看一下

    M6 replied in 2009/08/04 23:32

  • 逆子
  • http://www.plurk.com/no39purin
    麻煩您了
    謝謝
  • 發現原本的語法怪魚還是會出現,所以要在原本語法前面再加上一行:
    .cmp_loading{background:transparent url() 0 -180px no-repeat;width:0px;height:0px;}

    應該就沒問題囉~

    M6 replied in 2009/08/05 06:52

  • 小嗶波
  • 請問 有辦法 把照片那邊的底部也變透明嗎? 我都用不出來 麻煩你了
  • 是說個人簡介的照片與姓名那個區塊嗎?
    語法如下:

    /*自介區*/
    #dash-profile {
    filter: alpha(opacity=10);opacity: 0.1;-moz-opacity: 0.1;
    }

    透明度可以自行調整

    M6 replied in 2009/08/17 22:41

  • 小嗶波
  • 感謝 我會用了... 在請教一個問題 為什麼 我的河道的圖跟人物照片的圖片背景不對稱 請麻煩幫我看一下 趕謝 http://www.plurk.com/sdeva001#
  • 有使用全背景的圖 , 河道背景設"透明"就好囉 .
    #timeline_holder {
    background: transparent;
    }

    M6 replied in 2009/08/18 20:44

  • 冉
  • 再次請教版主:
    後來想再將河道中每則未點開的噗換背景色,可是用.plurk_cnt { background: #292929; }卻怎麼也不起作用?始終還是白色背景……?請告訴我如何解決 dd> <;;
    另,如果希望更換網址(http://i478.photobucket.com/albums/rr148/zendic/dd_img02.png)圈起來那4個位置的小圖更換成自己想要的icon,試問該怎麼寫語法?嘗試以版主提供換Plurk按鈕之語法更換,但用了『img[src="http://statics.plurk.com/b5013d83d670a7b88d13308929741d98.png"] {filter:alpha(opacity=0);
    -moz-opacity:.0; opacity:.0;}』會連也更換上去的圖片消失;只用『.submit_img { background: transparent url() no-repeat scroll top left; height: 38px; padding-left: 82px; width: 0px;
    overflow: hidden; margin-top: -40px; }』又會連原本的三角箭頭討出來壓在新icon上……究竟該用什麼方式換掉才好?? 
    再次謝謝版主的回答>///<bb!
  • 換每則噗背景色的語法

    /*噗浪底色*/
    #timeline_holder .plurk_cnt {
    background:# !important;
    }

    表情符號的圖片還沒換過 , 等下來試試看 ^ ^

    2010/10/30 語法有囉~
    /*更換 微笑表情選圖***/
    .smily_holder img /*隱藏笑臉符號*/
    {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity:0 !important;
    zoom:1;
    }
    .smily_holder /*放上替代圖片*/
    {
    background:url(http://圖片網址放在這) center center no-repeat;
    padding-right:24px;
    padding-left:0 !important;
    margin:0 !important;
    width:24px !important;
    }

    寬度和間距尺寸要隨圖片大小做適當調整喔!

    /*隱藏 語助詞旁的箭頭符號***/
    .dd_img img[src="http://statics.plurk.com/123918e3c72ef7b92780fffc44085dfb.gif"]
    {
    background-position:left top;
    background-repeat:no-repeat;
    overflow:hidden;
    height:0px;
    width:0px;
    }

    M6 replied in 2010/10/30 15:21

  • 小嗶波
  • 文字顏色怎麼換

    您好 又來打擾你了 我想請問一下 我在發噗的地方 發噗的文字是黑色 我想把他變白色 請問有這樣的語法嗎 感謝 ><
  • 有ㄚ, 語法如下:

    /*噗文輸入區*/
    textarea#input_big, textarea#input_permalink {
    color:#FFFFFF !important;
    }

    ^ ^

    M6 replied in 2009/11/04 22:32

  • Karajan
  • 噗背景透明但字不變

    請問有與法可以讓噗的背景變半透明, 但是裡面的字不跟著一起透明嗎?
  • 可以試看看以下的語法:

    /*每一則噗*/
    .plurk_cnt {
    background:#FFFFFF;
    filter: alpha(opacity=70); opacity: 0.7; -moz-opacity: 0.7;
    } /*背景*/
    .plurk_cnt a{
    color: #000000 !important;
    filter: alpha(opacity=100); opacity:1; -moz-opacity:1;
    } /*字*/

    如果不行的話,建議用一張透明的圖當噗的背景,不另外設透明度,就可以保持字不透明。語法如下:

    .plurk_cnt {
    background: url(http://) repeat; /*放圖檔網址*/
    }

    M6 replied in 2009/11/15 10:45

  • 艾斯特
  • 請問上方的我的檔案的文字顏色可以改嗎?我想改成亮一點的顏色但不知道要怎麼改才好~謝謝
  • 在 編輯 > 自訂CSS外觀裡 貼上下方的CSS語法:

    /*頁首*/
    #top_bar a { color: #ddf7ff; } /*滑鼠移過去前*/
    #top_bar a:hover { color: #8fcfee; } /*滑鼠移過去後*/

    color: # 後面的六個數字是色碼,可自行填入喜歡的顏色

    色碼可以參考這個網站: http://www.colorschemer.com/online.html

    M6 replied in 2009/11/14 23:14

  • 艾斯特
  • 打了之後沒有反應耶,還是原來的顏色
    http://www.plurk.com/e850235
    這是我噗浪的網址可以幫我看看嗎?
  • 艾斯特
  • 可以了~後來發現是我傻傻沒有重新整理XD看了你的網站才發現好多之前用了很喜歡的背景都是你設計的!!超厲害!!!謝謝你幫我解決問題~
  • 你的噗背景很有趣!很有自己的風格~ ^ ^
    是你自己畫的嗎?很讚喔~

    問題解決了就好~
    謝謝你喜歡我設計的佈景,動手打造適合自己的佈景,是很愉快的事~ :-D

    M6 replied in 2009/11/15 10:39

  • bigbear0815
  • 請問發噗區旁邊姓名、統計、朋友、粉絲字怎麼改顏色大小
    謝謝~
  • /*發噗區旁邊的姓名*/
    #main_poster .qual_holder{
    color: #FFFFFF; /*色碼*/
    font-size: 22px; /*大小*/
    }

    /*控制面板文字--統計,朋友, 粉絲 三個標題*/
    #dash-stats h2, #dash-friends h2, #dash-fans h2 {
    color: FFFFFF; /*色碼*/
    font-size: 15px; /*大小*/
    }

    M6 replied in 2010/02/04 22:33

  • LISA
  • 請問一下,【發送私密 plurk】【加入XXX為朋友】【追蹤XXX的plurk】這三個按鈕我用火狐開看的到但是用IE開就看不到這三個扭,請問我該修改哪個部分的CSS呢?
  • 按鈕的CSS是:
    /*發送私密噗按鈕*/
    .friend_man.private_plurk { }
    /*加入朋友與追蹤粉絲按鈕*/
    .friend_man.add_follow, .friend_man.remove, .friend_man.add_friend, .friend_man.pending { }

    因為我沒有IE,所以無法測試來了解原因,請試試看囉~

    M6 replied in 2010/02/10 16:24

  • someone
  • 想請教一下…

    你好,我在找語法,想用來隱藏統計區域的數字 (我想隱藏最後登入日期那邊)
    目前是把統計區的數字顏色設成與背景相同,這樣乍看之下似乎隱藏了,
    不過只要去反白就會看到。因為我不太懂css,不知道你有沒有什麼做法,
    可以隱藏統計區域呢? 就是隱藏檔案檢視次數、加入日期、上次登入…等等欄位…
    可以遮住或是整區隱藏之類的? 謝謝你!
  • 讓統計資料這區都消失不見,語法如下:

    /*控制面板: 隱藏統計資料整區*/
    #dash-stats {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    }

    如果要讓卡馬顯示出來,只隱藏下方的數值,則是:

    /*控制面板: 隱藏統計資料數值*/
    #dash-stats table, #dash-stats table td {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    }

    M6 replied in 2010/03/03 08:51

  • someone
  • 太~強~啦~

    你好,我試了語法,已經完美地完全隱藏了,二個語法都沒問題!
    真是太棒啦! 解決我長期以來的問題! 非常非常感謝你的熱心! :D 謝謝!
  • ^ ^

    M6 replied in 2010/03/03 22:45

  • 蝶戀楓
  • 請教一下

    如何將噗浪好友區和粉絲區下方的搜尋隱藏起來?
  • 語法如下:

    /*朋友區: 隱藏搜尋區*/
    #dash-friends p, #dash-friends form {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    }

    M6 replied in 2010/03/17 14:37

  • 蝶戀楓
  • 請教一下

    朋友區下方的邀請那個東西和粉絲區下方的小工具透明化語法怎麼打呢?
  • /*隱藏分享按鈕--------------------------------------*/
    #sharePlurk, a#dashboard-invite, a#dashboard-invite span, #sharePlurk div,
    img#icon_home, img#icon_friends, img#icon_notifications,
    a#dashboard-invite,a#mobile-gfx,a#widget-gfx,a#twitter-gfx,
    .dash-icon {filter:alpha(opacity=0)!important; opacity:.0!important;}

    M6 replied in 2010/03/18 08:57

  • 蝶戀楓
  • 感恩

    已經消失了~感謝教學
  • 蟑螂
  • 可以請問一下如何讓最上方的地方背景透明嗎?
    就是我的檔案 我的朋友 通知那個地方~
    謝謝
  • 是說加上白色透明背景嗎?
    語法如下:
    #top_bar .content {
    background:#FFF!important;
    filter:alpha(opacity=60) ; -moz-opacity:0.6; opacity: 0.6;
    }

    如果是要讓頁首的小圖變不見,那就把透明度設為0就可以了。
    語法如下:
    #top_bar .content {
    filter:alpha(opacity=0) ; -moz-opacity:0; opacity: 0 !important;
    }

    M6 replied in 2010/03/21 18:32

  • 悠希
  • 超級詳細,很棒的參考資料,真的非常感謝!!!
  • ^^

    M6 replied in 2010/03/23 21:14

  • Jackolantern
  • 抱歉請問一下,每條換日線下面的今天、昨天,這些是在CSS架構的哪裡?
    目前只找到底線上顯示13:00、20:00是在".bottom_start , .bottom_end"
    謝謝你!
  • /*日期標示*/
    #timeline_bg .day_bg .div_inner { } /*換日線*/
    .day_start .bottom_start, .day_start .div_start { } /*日期文字*/

    M6 replied in 2010/03/29 12:42

  • e1989823
  • 我想請問一下,如果就是要改上面那個標題顏色....就是最上我的檔案.我的最愛那邊的顏色...要怎麼改呢??
  • 語法如下:

    /*標題*/
    #page_title {
    color:#;
    }

    /*編輯文字*/
    #top_bar .content a#edit_link {
    color:#;
    }
    #top_bar .content a:hover#edit_link {
    color:#;
    }

    /*通知數字*/
    #alert_beacon {
    color:#;
    }

    /*頁首左邊文字*/
    #top_bar, #top_bar a {
    color:#;
    }
    #top_bar a:hover {
    color:#;
    }

    /*頁首右邊文字*/
    #top_login, #top_login a {
    color:#;
    }
    #top_login a:hover {
    color:#;
    }

    M6 replied in 2010/04/02 00:09

  • e1989823
  • 謝謝妳~
  • 小林
  • 請問 怎麼隱藏朋友區和粉絲區,只留加入鍵

    因為網路的語法都失效,想請教一下 如何隱藏朋友區和粉絲區,只留加入鍵?? 謝謝
  • /*隱藏朋友區及粉絲區*/
    div#dash-friends {filter:alpha(opacity=0)!important; opacity:0!important;}
    div#dash-fans {filter:alpha(opacity=0)!important; opacity:0!important;}

    但加入按鈕同樣會被隱藏喔

    2010/10/30 更新:
    /*隱藏朋友粉絲圖和標題***/
    div#dash-friends-pics, div#dash-fans-pics, #dash-fans h2, #dash-friends h2
    {
    filter:alpha(opacity=0) !important;opacity: 0 !important;zoom:1;
    height:0px;overflow:hidden;
    }

    M6 replied in 2010/10/30 15:38

  • 豬豬
  • 你好~我想請問一下要怎麼樣把右上角的噗浪生物用成透明透明的阿?
    ((不是完全隱藏0。0/))
  • 改透明度數值即可。

    /*噗浪生物*/
    #dynamic_logo ,#logo img {filter:alpha(opacity=40) ; -moz-opacity:0.4; opacity: 0.4; }
    img#creature{ filter:alpha(opacity=40) ; -moz-opacity:0.4; opacity: 0.4; }

    40 0.4 0.4 可以自行調整

    M6 replied in 2010/04/21 08:28

  • 豬豬
  • 謝謝你^^
    那我想再請問一下~頁面的捲軸和河道上的噗浪打開的捲軸能夠改嗎@@?
    好像直接套用網頁的CSS行不通ˊ口ˋ.......
  • 捲軸樣式嗎?好像只有ie能用...可是我沒用ie已經很久了~.........

    M6 replied in 2010/05/14 18:00

  • 呆呆
  • 你好~請問一下關於音樂播放時,使用背景播放模式的時候。。
    出現在河道右下角的那個提示訊息要怎麼改@@?
  • 語法如下:

    /*音樂播放器*/
    #music_player {
    border: !important;
    background:#;
    color: #;
    font-size:px !important;
    }
    #music_player a {
    color: #;
    font-size:px !important;
    }
    #music_player a:hover {
    color: #;
    }

    M6 replied in 2010/04/21 16:10

  • 呆呆
  • 對了,想順便問一下語助詞那一排的底色白色能夠改顏色嗎@@?
    不是語助詞本身的底色,是語助詞下面那塊白色的地方。。。
  • 語助詞下面?是指發噗區的私密語系選項嗎?還是河道上的噗的底色?

    M6 replied in 2010/04/21 16:11

  • 呆呆
  • 都不是耶0。0
    我的意思是指說像是"說"這個語助詞如果他的框框邊緣變成圓角。。
    就會露出下面白色的部分@@所以。。。想請問一下能改那部份的顏色嗎?
     ___
    ( 說 )    <<大致上的想像圖是這樣。。
     ───
    然後因為是方角改圓角。。所以會露出4個角的白色底色@@。。
    想說是不是能夠改成透明的呢?
  • 語法如下:
    .AmiMenu {
    border:none!important;
    color: #ffffff !important;
    background:none!important;
    }
    .qual_menu .q_shares {
    border:none!important;
    }

    M6 replied in 2010/04/22 11:52

  • 路人
  • 不好意思,想請問一下怎麼改
    "私密 plurk、語系與選項 可以看到這則 plurk 的是 只限我的朋友"
    部分的背景或自的顏色?
  • 語法如下:
    .private_to b{
    background:;
    border:;
    color:# !important;
    }

    M6 replied in 2010/04/22 11:29

  • 路人
  • 你好,我想請問一下有關河道上的噗打開後,想要針對某個人的話作回覆時。。
    不是在右邊會出現一個可以點選回覆此人的那行東西嗎0。0?
    那個部分要怎麼改呀=0=?
  • 相關語法:
    /*每則回應的時間與回覆列*/
    div .response_time plurk_cnt { }
    div .holder {background:# !important;}
    div .holder p {font-size: px;color:# ; background:# ;}

    M6 replied in 2010/05/14 17:58

  • KOKO
  • 你好~請問每一則噗裡的LOADING圖有辦法變大嗎?
    想要擺跟那隻魚差不多大小的動圖,可是都會被卡掉
    不知道有哪個地方可以修改一下的,謝謝你:)
    附上我的語法~
    /*更換loading圖--------------------------------------*/
    .cmp_loading {width:0px;height:0px;}
    #div_loading .cnt {
    background: url(http://blog.roodo.com/ohmiyamap/757c53ff.gif) no-repeat scroll center top !important;
    margin-top:140px;
    }
    .loading img {width:0px;height:0px;}
    .loading {
    background: url(http://blog.roodo.com/ohmiyamap/833ed0c9.gif) no-repeat scroll center top !important;
    margin-top:30px;
    }
  • 加上圖片的長寬,
    #div_loading .cnt {width:50px;height:52px;}
    .loading {width:16px;height:16px;}
    就可以了。

    M6 replied in 2010/05/01 00:14

  • KOKO
  • 真的真的很謝謝你!!
    我成功的改好了!!
    現在連等待的時間都變的好美好呀~~
  • =W=

    M6 replied in 2010/05/14 18:01

  • YI
  • 請問我想更改
    回覆訊息裡的數字和框框的顏色
    (回覆訊息數字5,和有未讀的框框顏色)
    是從哪邊改呢?
    謝謝^^
  • 語法如下

    /*回應數*/
    .response_count { /**已讀回應**/
    background:#;
    color:#;
    font-size:px;
    margin-left:px;
    padding:3px;
    filter:alpha(opacity=) ; -moz-opacity:; opacity:;
    }
    .new .response_count { /**未讀回應**/
    background:#;
    color:#;
    font-size:px;
    margin-left:px;
    padding:3px;
    filter:alpha(opacity=) ; -moz-opacity:; opacity:;
    }
    .dots .inner {border: ; color:#; background:#;} /**中間的. . .**/

    M6 replied in 2010/05/05 22:46

  • winya
  • 您好,請問如何設定背景圖的大小呢,因為放上去只會在左半邊呈現,右半邊則是全黑的,謝謝!
  • 要使用在噗浪的全背景圖,需要至少1024x768以上的圖片(依個人電腦螢幕解析度不同,如果是寬螢幕的話,有時要使用到1920x1080的圖才能全背景喔)

    M6 replied in 2010/05/18 00:21

  • WHAT
  • 我想請問
    如果要讓統計欄變透明語法是什麼
    因為我複製上面的沒辦法
    謝謝!!
  • 是說要整個隱藏起來?還是有透明度呢?

    隱藏的語法如下:
    /*控制面板: 隱藏統計資料整區*/
    #dash-stats {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    }

    透明度的語法:
    #dash-stats {
    filter:alpha(opacity=80) !important;
    -moz-opacity:0.8 !important;
    opacity:0.8 !important;
    }

    80 0.8 0.8 數值可依需要調整

    M6 replied in 2010/05/30 21:43

  • 多多
  • 噗浪上時間隱藏的語法

    不知道能否像http://www.plurk.com/bimbotonto 這樣的
    只有當滑鼠滑到一個噗時
    才會有時間顯示出來就好
  • 可以ㄚ,這是我設計的 shinning tail 版型
    http://bemyselfinc.com/html/d_plurk.html 這個頁面可以找到並套用
    ^^

    只要先把線上的時間隱藏起來就可以了
    .bottom_start , .bottom_end {background: transparent; font-size:0px; }

    然後就只會顯示每一則噗的時間




    M6 replied in 2010/06/02 00:43

  • 多多
  • 感恩!!有成功了

    只是突然覺得原本有的EX:今日、昨天、2天前或是日期的
    就都不見了 還真有點不習慣
    能否日期還是有 而時間沒有沒關係的語法呢...
  • 那就把日期放到河道上方,下方的時間軸隱藏就好囉。
    相關的語法:

    /*換日線背景*/
    #timeline_bg .day_bg .div_inner {
    background:#eeccaa;
    width:28px; /*調整高度*/
    height:3px;
    border-color:#;
    }

    /*日期文字*/
    .day_start .bottom_start, .day_start .div_start {
    color: # !important;font-size: px;
    }

    時間的隱藏則如上則回應

    M6 replied in 2010/06/02 18:40

  • 多多
  • 想弄成單張圖背景...

    我有試了幾張圖一開始覺得怎麼都無法
    像你提供的可下載面板那樣的可以整個填滿視窗
    後來去找了一張1920*1080的也是一樣
    都還會有[上方]跟[下方]會有留黑色的部份
    不知道如何解決 囧阿~~~
    ------
    另外有個問題是:
    想要全背景單圖的話
    下半部的整體主控台部份 想要是" 透明 "的
    之前有試過別人的語法過
    但還是會有邊框出現
    想要跟你那樣有提供面板部份 有的主控台透明是無邊框細細的那樣
    要怎麼弄出來呢...
  • 可以試著把背景圖片固定住,語法:
    body, html {
    background-attachment: fixed;
    }

    拿掉主控台邊框的語法:
    #plurk-dashboard {
    border:0 !important;
    }

    M6 replied in 2010/06/02 18:46

  • 多多
  • /* 下方面版主控台部份 */

    1.謝謝你在#41跟#樓的回答 我有試了#41的狀況後將你的語法複製過去後
    結果好像沒有出現我要的那樣。

    2.主控台的部份 其實可能我一開始就沒有問好吧
    其實是想要像你所提供可下載的版型當中有 hold on 、soli night、shinning tail 的這幾款中那樣的透明主控台但還是可以看出整個的面板有淡淡的FU那樣
    我有TRY了#42的語法後 會變成都無框的沒錯只是覺得跟我預期想的不一樣就是...

    3.因為想要自己用一張大張的圖作為底圖後類似像你那樣的樣板語法可是在字型方面或者其他什麼如:
    加大回應區的列距、加大字體40% 有的沒的不去動的話這樣的語法怎弄呢?
    4.我有自己找過透明語法的部份 不知道是不是跟你所作的面板
    (hold on 、soli night、shinning tail)那樣是不一樣的

    4-1
    body, html {
    background: url(這邊放圖片的網址);border:hidden; margin: 0;}
    #plurk-dashboard, #plurk_form ,#toggle_tab {opacity: 0.5; filter: alpha(opacity=50);}
    #timeline_holder {background:none; border:hidden;}
    .day_bg .div_inner{background: none;border:hidden;}
    #plurk-dashboard{background:none; border:hidden;}
    #bottom_line {background:none; border:hidden;}

    4-2
    body, html {
    background: url(http://你的圖片位址);
    background-repeat: no-repeat;
    background-position: center;
    background-color: black;}
    #timeline_holder {background: none;}
    #plurk-dashboard {background: none;}

    4-3
    body
    {background: #000000 url(full_screen.jpg);
    background-repeat: repeat;}
    #timeline_holder{background: none;}
    .plurk_cnt{opacity: 0.75;filter: alpha(opacity=75);}
    #top_bar{opacity: 0.5;filter: alpha(opacity=50);}
    #top_login{opacity: 0.5;filter: alpha(opacity=50);}
    #plurk-dashboard{background: #808080;opacity: 0.5;filter: alpha(opacity=50);}
    #bottom_line{background: none; opacity: 0.5; filter: alpha(opacity=50);}
  • 主控台的透明度語法:
    div#plurk-dashboard {
    filter:alpha(opacity=80) !important;
    -moz-opacity:0.8!important;
    opacity: 0.8!important;
    }

    然後字型行距等等如果想維持噗浪預設的話,就先套用較符合所需的一個佈景、換底圖後,刪除不要的語法就可以囉。

    M6 replied in 2010/06/03 20:37

  • 多多
  • 語法是否有時後會怪怪的

    最近覺得有時候之前貼過有成功的語法
    在貼過後幾次 在貼就沒有出現當初的效果了
    是噗浪伺服器的問題嗎...?
    因為語法都檢查過了 沒問題說
  • 有可能噗浪預設的CSS項目名稱有調整,
    也有可能是其他的語法影響到,要看語法內容才知道囉。

    M6 replied in 2010/06/04 21:22

  • 多多
  • 有發現到即使在自訂修改CSS中放上了自己要的語法外
    但是在跟內建的佈景模式有三種可選擇的那個
    一有調整某部份的顏色等 也會跟著被更動耶
    怎會這樣....
    也就是說 假設用了一個很喜歡的CSS語法套用後
    若不小心的調整到內建的部份
    結果也會有不同
  • 嗯,的確內建會有影響,如果該部份沒有設定自訂的CSS的話,
    所以,有影響的話就表示該佈景並未設定那部份的語法。
    可以重新套用試試看,或調整一下內建試試,或直接加以設定該部份的語法囉。

    M6 replied in 2010/06/04 21:21

  •  
  • 想請問下,若我想把噗浪的時間軸前後返回按鈕更換樣式怎麼使用?
    如圖中紅框那樣的改變→http://www.fileden.com/files/2007/2/12/764520/003.PNG
    一直找不到相關的語法呢,謝謝。
  • /*時間軸往前往後圖示*/
    .cmp_arrow_right {
    background: url(放圖片網址);
    width: px;height: px; /*圖片的寬與高*/
    }
    .cmp_arrow_left {
    background: url(放圖片網址);
    width: px;height: px;
    }
    .cmp_back_to_today {
    background: url(放圖片網址);
    width: px;height: px;
    margin-left:20px;
    }

    M6 replied in 2010/06/04 21:03

  • 9D
  • 噗浪最上面那行~

    想請問噗浪最上面那行的背景在哪邊設定呢??
    不是左上角也不是右上角的top_login什麼的~~~那邊我有小小試過一下,改背景只能改到字的背景QQ
    我想改的是一整行~像這個http://www.plurk.com/reicat的最上面一樣~
    顏色可以稍微深一點這樣~
    找了所有有opacity的地方也沒有用(哭哭)~~~
    請幫幫我:-'( 謝謝~~
  • 9D
  • 啊~不好意思!!

    我剛又亂try了一下~結果真的是#top_login的部分......(汗)
    不好意思來亂了OTL
    (P.S.我之前改到的是#top_login a所以沒效果...原來是有沒有a是有差別的啊OTL)
  • 所以已經改好囉? 嗯,語法是
    /*頁首登入列背景*/
    #top_login {
    background:#000 !important; /*背景色*/
    filter:alpha(opacity=80); /*透明度*/
    -khtml-opacity:0.8;
    -moz-opacity:0.8;
    opacity:0.8;
    }

    M6 replied in 2010/06/10 16:11

  • carcar
  • 您好:

    請問河道上左右兩邊各有一個藍色的箭頭-「back to star」鍵,要怎麼改成半透明的?
    可以換樣式?
  • 語法如下:

    /*往前往後箭頭設透明度*/
    .cmp_arrow_right, .cmp_arrow_left, .cmp_back_to_today {opacity:0.2;}
    .cmp_drop_down img {opacity:0.2;}
    數值可以自行調整。

    /*更換時間軸往前往後圖示*/
    .cmp_arrow_right {
    background: url(圖片網址);
    filter: alpha(opacity=60); opacity: 0.6; -moz-opacity: 0.6; /*透明度*/
    width: px;height: px; /*圖片大小*/
    }
    .cmp_arrow_left {
    background: url(圖片網址);
    filter: alpha(opacity=60); opacity: 0.6; -moz-opacity: 0.6;
    width: px;height: px;
    }
    .cmp_back_to_today {
    background: url(圖片網址);
    filter: alpha(opacity=60); opacity: 0.6; -moz-opacity: 0.6;
    width: px;height: px;
    }

    M6 replied in 2010/06/17 19:50

  • Fay
  • 請問要怎樣才能把plurk河道上的白色分割線弄走(不是換日線)?
    我試了半晚都弄不走,快要哭了OTL
    >>http://www.plurk.com/Fayase
  • 應該是因為選了噗浪預設組合的關係(自訂外觀中預設的三個選項),
    可以選其他的"時間軸"佈景,就不會出現了

    2010-09-16 更新:
    找到相關語法囉~
    /***隱藏特定時間軸主題的時間直線***/
    .block_bg .div_one_line
    {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    height:0 !important;
    width:0 !important;
    overflow:hidden;
    }
    .small_timeline .block_bg .div_one_line
    {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    height:0 !important;
    width:0 !important;
    overflow:hidden;
    }

    M6 replied in 2010/09/16 13:02

  • 阿蕭
  • 請問一下,就是我想要對此人做回覆,會有一個小箭頭出現!
    我想要修改他出現後的那個頁面...底色 文字顏色...等等
    是要輸入什麼要的語法呢?
  • 是這篇文章的 /* 使用者小視窗*/ 那一段
    請參考喔

    M6 replied in 2010/06/24 23:23

  • 阿蕭
  • 好的!謝謝
  • J
  • 請問一下
    這是我的噗
    http://www.plurk.com/jaeyu_sujuelforever

    但是我的標題會往左移
    是哪個語法錯了嗎?

    要怎樣才能讓他置中?
    謝謝
  • 是指頁首的標題?自訂語法中並沒有設定頁首,所以應該是置中的,我這邊看也是置中的喔。

    M6 replied in 2010/06/29 18:09

  • pumpkin
  • 請問 stat 的兩行 how to ....如何不顯示

    stat 裡面有兩行 how to ....
    請問如何像你的噗那樣不顯示呢?
    謝謝唷~
  • .link_arrow {
    height:0 !important;
    font-size:0 !important;
    position:absolute;
    opacity:0 !important;
    filter:alpha(opacity=0) !important;
    zoom=1;
    }

    M6 replied in 2010/07/27 13:31

  • pumpkin
  • 成功了 感謝~
  • ^ ^

    M6 replied in 2010/07/28 17:53

  • marshaluzomaemme
  • 寫的好!加油!
  • 謝謝~ ^ ^

    M6 replied in 2010/08/12 19:18

  • 請教一下
  • 不好意思打擾一下

    我想請問朋友區(8或12個小圖示那裡)小顯圖之間的間距要怎麼拿掉

    就是說改成把每位朋友的顯圖都相互靠在一起~中間不要有間隔

    我試了很久都改不成功-.-

    可以麻煩幫忙解答一下嗎?

    非常感謝你!!辛苦了~!!
  • 試試看這個語法:

    /*朋友粉絲區--------------------------------------*/
    #dash-friends-pics .user_link, #dash-fans-pics .user_link {
    width: 26px !important;height: 26px !important;border: 0; }
    #dash-friends-pics img, #dash-fans-pics img {border: 0; }

    M6 replied in 2010/08/13 19:20

  • 找到語法了@@&quot;
  • HI~我是上面問問題的那位~

    您提供的方法我之前就有試過了~還是不行~但是...

    找了好久= ="還算是改出來了...要自己加上去一般人比較少用到的區塊

    #dash-friends table tbody tr th{}
    #dash-friends table tbody tr td
    {
    border:0;
    padding:0px;
    margin:0px;
    }

    我是參考到這篇裡的某一段下去修改的~
    http://idobest.pixnet.net/blog/post/24797256

    不過還是感謝你熱心回覆~

    謝謝!!
  • 改好真是太好了~ 等下我也來試試效果 ^ ^

    M6 replied in 2010/08/16 15:42

  • :  )
  • 先謝謝你的網站讓我學到許多實用的 CSS : )
    不過有些問題我試了很多次還是無法解決 ~
    所以想在這請教你 :
    1.我噗浪「小視窗」(滑鼠移到Youtube影音圖片、個人照片、卡馬值的地方)
    背景上面都有個小箭頭,已經去改過背景,也沒設框線了,可是還是會出現框線+小箭頭
    是哪裡沒設定好?還是要加什麼語法呢?

    2.朋友區下面的「邀請或尋找您在Plurk上的朋友」及粉絲區下方的「分享您的Plurk頁面」這2個標籤要怎麼移除呢?試了很多網路上的語法,但都無效...

    3.你上面說的「統計、朋友、粉絲」 三個標題地字體顏色些改我試過了,可是還是不行耶~

    4.噗浪登出後,我的檔案、編輯、我的朋友、通知、首頁名稱那排和回應區中間有一條「免費註冊您的Plurk帳號」,想請問那一整條的背景和字體顏色的語法是什麼呢?

    5.我噗浪回應區消音和喜歡的按鈕顏色跟發噗者的顏色一樣,但是按了消音及喜歡變成「解除消音」與「不喜歡」後,又變成另一種顏色,想請問「解除消音」與「不喜歡」的顏色怎麼設定呢?

    6.我噗浪回應區打開之後 (您的plurk回應 下面那個大區塊,在我的名稱左邊的地方) 的左框線一直顯示不出來,但是右框線有顯示,找了很久還是找不到... 是我語法哪裡設定錯了嗎?

    可以請你幫忙解答一下嗎? 謝謝你囉 ^^
  • 語法如下:

    1.
    .AmiTT_main {background:none !important; border:0 !important;} /*隱藏小視窗背景箭頭*/

    2.
    /*朋友搜尋,入門說明,邀請朋友,分享連結,社交小圖示隱藏一次搞定*/
    #dash-friends p, #dash-friends form,
    div #tw_help,
    div a#dashboard-invite,
    div #sharePlurk,
    .dash-icon
    {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    height:0 !important;
    width:0 !important;
    overflow:hidden;
    }

    3.
    #dash-stats h2, #dash-fans h2, #dash-friends h2 /*標題*/
    {
    background:none !important;
    color:#333 !important;
    }

    4.
    /*註冊使用BAR*/
    #top_login a#sign_up {background:none !important;color:#555 !important;border:0;}

    5.
    .unmute {color:#444 !important; margin-left:5px;}

    6.
    .plurk_box .mini_form {
    border-left: 1px solid #333;
    }

    M6 replied in 2010/08/21 10:26

  • :  )
  • 非常謝謝妳 : )

    上面的6個語法還有2個有些小問題:

    1.第5個「解除消音」與「不喜歡」的顏色,我放了妳給的語法,可是怎麼還是沒改呢?

    2.第3個「統計、朋友、粉絲」 三個標題的字體顏色已經改好了 ^^
    可是我想讓這三個標題都置中,不要像現在這樣在左邊,
    我在妳給的語法後面加上 text-align: center !important; ,
    可是不行耶 ~ 請問要怎麼讓這「三個標題的字體置中」呢?

    另外還想請教妳幾個問題:
    1.滑鼠移到「噗浪未打開前」時,要怎麼把它的「字距和行跟行之間的距離加寬」呢?
    我在 .plurk_cnt { 裡面加了 letter-spacing: .2em /*字距*/ line-height: 17px; /*行距*/ ,
    一開始可以,但後來又變回原本的樣子,是哪裡設定有問題嗎?

    2.我噗浪打開後,「回應區右邊界的那條框線」都會「內縮」 ( 左邊界不會) ,
    要怎麼樣才能和上面的噗文區及下面的個人回應輸入區一樣寬呢?

    3.噗浪打開後,「個人回應輸入區最下面那個小長方形的資訊欄」
    (左邊是說有幾個人喜歡這則噗浪,右邊寫連結) 的「四個框線顏色」的語法是什麼呢?

    4.噗浪上的 「back to star 箭頭按鈕」,我用了妳上面的
    /*往前往後箭頭設透明度*/
    .cmp_arrow_right, .cmp_arrow_left, .cmp_back_to_today {opacity:0.2;}
    .cmp_drop_down img {opacity:0.2;} 語法,但還是不行耶 ~

    5.噗浪上左下角的「更新通知區」裡面,
    「幾則新的回應」和「幾則新的 plurk」這幾個字的顏色可以改嗎?

    6.想請問「發送私密 plurk 按鈕」的字體及背景顏色設定的語法是什麼呢?


  • 1.
    該部份的語法項目就是如上則回覆所列的喔,
    可能是其他的語法有重複到,比如說連結的設定?
    要看看實際的CSS內容才能較清楚。

    2.
    /*統計,朋友,粉絲*/
    #dash-stats, #dash-friends , #dash-fans {text-align:center;}

    _____________________________________________________

    1.
    語法項目是對的,可以試著在後面加上 " !important;" 看看?
    原本可以後來不行,也可能是其他的語法產生衝突的問題。

    2.
    這好像是噗浪預設語法產生的問題?有固定寬度的樣子,
    目前還不清楚語法怎麼改,如果有發現再回覆你喔。

    3.
    .info_box {
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
    }

    4.
    試著在後面加上 " !important;" 看看?
    或試試:
    filter: alpha(opacity=20) !important;
    opacity: 0.2 !important;

    5.
    #updater .text {
    color:#ccc !important;
    }

    6.
    #more_options_link {
    background:#333 !important;
    color:#ccc !important;
    border:0 !important;
    }

    M6 replied in 2010/08/21 17:32

  • :  )
  • 剛剛妳給的語法解決了我噗浪大部分的問題,謝謝妳囉 : )
    關於那個解除消音的部份,我後來才發現,它不能直接貼在最下面,
    要加在「每則訊息的文字連結顏色設定」的最下面才可以 ^^

    第4個「back to star 箭頭按鈕」還是不行耶 !
    它不像上面解除消音的部份有相關語法,可以讓我直接貼在下面 ~

    還想在請教妳幾個問題:

    1.噗浪打開後,「個人輸入回應區」下面,
    「按下 Enter 新增」這幾個字可以「改顏色」嗎?

    2.上面問妳的第1個問題,
    我在 .plurk_cnt { 裡面加了 line-height: 18px !important; /*行距*/ ,
    但噗浪還沒打開時,「行和行間字的距離還是沒變寬」,
    只有 letter-spacing: .2em !important; /*字距*/ 有變寬 ~

    3.每則噗浪裡面的 「loading 圖」,能不能「顯示整張圖,不要重複」呢?
    我已經把 repeat 拿掉了,但在 loading 時,還是會重複 ~
    我的語法如下: /*更換loading圖*/
    .loading img {height:0;width:0;}
    .loading {background:transparent url(http://img62.imageshack.us/img62/7893/back334.gif) scroll center !important;margin-top:50px;}
    #div_loading .cnt {width:216px;height:196px;}
    .loading {width:216px;height:196px;}
    (我沒有主頁面的 loading 圖,所以 .loading img {height:0;width:0;} 都設為0

    4.上面第6個妳給的語法,我的 #more_options_link 是「私密語系選項」,
    不是「發送私密 plurk 按鈕」,但上面還有「控制面板更改plurk私密、語系和選項等等」,
    我兩邊都設定過了,「發送私密 plurk 按鈕」還是沒變 ~

    5.把「私密 plurk、語系與選項 」打開後,
    「私密 plurk、語系與選項 」和「只限:」的「框框顏色」可以改嗎?

    6.有可以把「封鎖使用者按鈕」拿掉的語法嗎?

    可以再麻煩妳幫忙解答一下嗎? 謝謝你囉 : )
  • 1. 這部份的語法還沒試出來,有發現的話再回覆喔
    2. 噗浪還沒打開前好像都只有一行? 試試看用 line-height:160%; 或是用 padding:2px; 來達到你要的效果?
    3. 要加上 no-repeat 圖片才不會重複喔
    4. 喔,是「發送私噗的按鈕」,那語法項目應該是 .friend_man.private_plurk { }
    5. 可以,「只限」的語法:.auto_ta { border:1px solid # !important;}
    6. 語法: .friend_man.block {filter:alpha(opacity=0)!important;opacity:0!important;}

    M6 replied in 2010/08/27 23:48

  • KUMU子
  • 您好~~~我想問 就是每一則噗的框框怎麼用成白色?
    因為我的噗框都會有顏色不是很喜歡...感謝XD
  • /*浪上的噗*/
    .plurk_cnt {
    border-color: #fff !important;
    }

    M6 replied in 2010/08/27 06:34

  • Dylan
  • 你好喔!我有一個想要請教大大 ~
    就是我打開閱讀別人的噗浪時,前一位噗浪的使用者小圖像會蓋住新噗的字
    這是哪邊出了問題@@??謝謝大大回答喔^^
  • 不太瞭解你的問題,可以截圖給我看嗎?
    謝謝~

    M6 replied in 2010/08/27 06:36

  • whatever
  • http://www.plurk.com/zef13zef13
    請問一下像這個噗後面有框框,回覆時也有是怎麼弄的呢?
  • 這是噗浪預設的框框樣式喔,
    要自行修改的話,語法:

    /**********浪上的噗*********** 整體 *********************/
    .plurk_cnt {
    border-top: 0px solid # ; /*上框線*/
    border-left: 0px solid # ; /*左框線*/
    border-right: 1px solid # ; /*右框線*/
    border-bottom: 1px solid # ; /*下框線*/
    }

    /*回應列表框線*/
    .plurk_box .list,
    .plurk_box .mini_form,
    .info_box
    {
    border-top: 0px solid # ;
    border-left: 0px solid # ;
    border-right: 1px solid # ;
    border-bottom: 1px solid # ;
    }

    M6 replied in 2010/08/29 18:00

  • YUKIKO
  • 你好~我是在網路上拿網路提供的版型來修改我的CCS的
    但是有個地方還是不太會改所以來詢問一下:
    請問如何更改發噗狀態的顏色(就是"說""喜歡""分享"的那個地方)
    因為我的"說"字鍵很不喜歡現在的顏色想要更改~但是都不知道要怎麼修改呢??
    而且我的河道上只要有朋友發噗狀態是使用"說"這個字也是同樣顏色呢@@"
  • 語法~

    /*語助詞*/
    .q_says,.q_is /*說*/
    {
    background:# ;
    color:# ;
    border-top: 1px solid # !important;
    border-left: 1px solid # !important;
    border-right: 1px solid # !important;
    border-bottom: 1px solid # !important;
    }

    M6 replied in 2010/08/29 17:51

  • binbin
  • 不好意思 想請叫一下 因為我的 個人顯圖 外圍都有一圈白色
    可以把那圈用成透明的嗎? 希望看起來會和底圖更融入 比較不會突兀
  • /*個人圖像*/
    #profile_pic {border:0 !important;}

    M6 replied in 2010/08/31 07:57

  •  : )
  • 謝謝妳之前給的語法,

    大部分都已經解決我 Plurk 的問題了 ^^
  • ^^

    M6 replied in 2010/09/02 19:51

  • kevins
  • @@不好意思...
    請問個人資料 統計 朋友 粉絲
    怎麼讓他們各別在滑鼠移動前是看不到的 滑鼠移動後才可以看到呢?
    就像發噗區那樣可以有移動前移動後的變化
    可以麻煩妳幫忙解答一下嗎? 謝謝你
  • /*資料面板透明度變化*/
    div.dash-segment {filter:alpha(opacity=0) !important;opacity:0 !important;}
    div.dash-segment:hover {filter:alpha(opacity=100) !important;opacity:1 !important;}

    M6 replied in 2010/09/06 10:27

  • 泡泡冰~
  • 不好意思 可以請問一下 河道區要如何改成滑鼠移動前是看不到的 滑鼠移動後才看到的呢XD!
  • /*隱藏與展開浪上的噗*/
    #timeline_cnt {filter:alpha(opacity=0)!important;opacity:0!important;}
    #timeline_cnt:hover {filter:alpha(opacity=100) !important;opacity:1 !important;}

    M6 replied in 2010/09/07 14:02

  • 幻化成風
  • 您好,首先謝謝您分享了這麼多改噗浪CCS的方法!
    真的很受用…但是我有個問題,
    就是我選擇的版型,回應一多時,
    有些字就會被捲軸擋住看不見↓↓
    http://img3.imageshack.us/img3/3986/33514142.jpg
    請問是什麼原因呢?
    我找了好久不知道該怎麼改?
    好像只有某些版型會這樣…其他都不會!
    可是我又很喜歡現在的版型不想換…
    拜託您解答了,謝謝。
  • 可以試試看
    /*回應列表:寬度*/
    .list table {width:98% !important;}
    調整98的數值,到符合可以看見內容的寬度

    M6 replied in 2010/09/07 14:04

  • 幻化成風
  • 真的非常感謝您!
    我剛剛嘗試了一下,真的可以看到字,
    不會被擋住了…^___^
    非常感謝您百忙之中抽空教學。
    真的是非常實用的文章!
  • ^W^

    M6 replied in 2010/09/07 19:48

  • Mia*
  • 請問一下

    我有用改loading圖
    不過改完後
    我要的圖和原本預設的圖也一起跑出來了
    請問要如何改呢

  • /*更換 loading圖***/
    .cmp_loading {width:0px;height:0px;} /*主畫面*/
    #div_loading .cnt
    {
    background:transparent url(http://) no-repeat scroll center !important;
    margin-top:140px;
    }
    .loading img {width:0px;height:0px;} /*每則噗*/
    .loading
    {
    background: url(http://) no-repeat scroll center top !important;
    margin-top:30px;
    }

    M6 replied in 2010/09/27 08:37

  • Mia*
  • ~

    .cmp_loading {width:0px;height:0px;}

    原來要加這一行才可以
    讓原本的loading圖長寬都變0

    謝謝大大的回覆:D
    現在已經搞定了
  • ^ ^

    M6 replied in 2010/10/02 19:05

  • Mia
  • 不好意思~

    大大你好~
    我又遇到一個問題
    在我這邊登入的看好有那邊只有8個圖
    但是沒登入看就有12張圖

    請問要怎樣改呢?
    還是不能CSS改呢
  • 是說朋友粉絲圖嗎?
    那是噗浪預設的值。

    M6 replied in 2010/10/02 19:05

  • Yuko
  • 不好意思我想請問一下...噗浪的已回應視窗的字體如何改大一點
    還有你的部落格好像設定無法copyㄟ :)

  • .list .plurk_cnt .td_cnt
    {
    font-size: px;
    }

    數值可以自行設定

    M6 replied in 2010/10/02 19:07

  • huang
  • 我已經把統計區的欄位隱藏,那我可以移動朋友區和粉絲區位置嗎,還有可以將朋友區和粉絲區外面的框框變透明與背景融入嗎?
  • 移動位置是指?

    /*朋友粉絲區背景與框線消除*/
    #dash-friends, #dash-fans
    {
    background:none;
    border:0
    }

    M6 replied in 2010/10/02 21:08

  • 幻化成風
  • 不好意思,最近剛好想換圖又遇到問題了…
    大大這裡我已經加入最愛了,
    隨時看有沒有可以解決的噗浪問題?
    不過我好像沒看到我這次的問題…Orz

    --------

    就是例如某張圖片的大小不及整個噗浪版面,
    我想讓那張圖放大到可以充滿整個噗浪頁面…
    請問有辦法嗎?
    謝謝您的解答。
  • 這跟個人的電腦螢幕解析度有關,
    通常至少要1024x768以上的圖,才能做全背景,
    以我的NB為例,1280x1024以上的圖才足夠,
    如果希望下方(圖的高度)能涵蓋滿不露出來,
    可以試著加上「固定背景圖」的語法:

    /*+畫面佈景--------------------------------------------------*/
    body, html
    {
    background-attachment: fixed ; /*浮水印固定背景*/
    }

    M6 replied in 2010/10/16 11:21

  • 緋座
  • 想請問一下,發噗鈕的位置有辦法更改嗎? 有些新版型我套用後,原本應該在發噗攔右邊的發噗鈕會跑到原來位置的右上角
  • 嗯,這是因為噗浪後來有改過發噗按鈕語法設定的關係,
    不習慣噗浪將發噗區對齊靠上的噗友,可以加上這行語法讓它恢復置中:
    .plurkForm td {vertical-align:middle !important;}

    M6 replied in 2010/10/21 10:20

  • 咩咩
  • 有關於隱藏朋友區的語法,
    我直接使用上面的語法貼在css區最下面,
    但沒有隱藏效果,是不是要貼在特定段落呢???
  • 是用到哪一段CSS呢?隱藏的語法如下:
    /*完全隱藏朋友粉絲區***/
    #dash-friends, #dash-fans
    {
    filter:alpha(opacity=0) !important;
    -moz-opacity:0 !important;
    opacity: 0 !important;
    height:0 !important;
    width:0 !important;
    overflow:hidden;
    }

    M6 replied in 2010/10/22 15:58

  • 咩咩
  • 可以了,謝謝!
  • 幻化成風
  • 不好意思又來麻煩您…Orz
    請問怎麼更改這一排字體的顏色呢??
    ↓↓↓
    http://img443.imageshack.us/f/35298392.png/

    因為本身套用的噗版這排字體是黑的,
    只要圖片換成深色的這排字就看不見了><
    麻煩您解答了!!謝謝。
  • 是說時間軸上的時間嗎?
    #timeline_bg .bottom_start , .bottom_end /*字*/
    {
    color:#fff;
    font-size: 10px !important;
    }

    M6 replied in 2010/10/24 09:26

  • 幻化成風
  • 啊,不好意思,我表達的不夠清楚><
    我是指那排:所有的plurk、我的plurk、私人的、回應過的、喜歡的。
    那排字的字體顏色…也有辦法改變嗎?
    謝謝。
  • 可以,語法項目的開頭是:
    #filter_tab /*所有標籤*/
    #filter_tab a.off_tab /*未選*/
    #filter_tab a.filter_selected /*正選用的標籤*/

    M6 replied in 2010/10/24 11:27

  • 幻化成風
  • 謝謝您的熱心解答,
    我已經找到語法並且正在改了。
    不過我還碰到一個小問題…
    就是如果噗文輸入區是半透明的,
    有沒有辦法不要讓它半透明呢?
    不好意思問了好多問題…
    感謝您百忙之中的解答!!
  • 在 /*主控台發噗區*/
    textarea#input_big.content
    將背景的透明度語法刪除即可。
    也就是刪除如:
    filter: alpha(opacity=80);
    opacity:0.8;
    的設定

    M6 replied in 2010/10/25 00:09

  • 鹿鹿
  • 您好:
    我想讓我噗文輸入區的背景色是白色
    卻又有半透明的感覺
    請教語法應該怎麼輸入
    謝謝!!!
  • /*主控台發噗區***/
    textarea#input_big_private, /*發送私密噗視窗*/
    textarea#input_big_private.content,
    textarea#input_big,
    textarea#input_permalink,
    textarea#input_big.content
    {
    background:#FFF !important;
    filter:alpha(opacity=80);opacity:0.8;
    }

    FFF 是白色的色碼
    80 0.8 是透明度數值,可以自行調整

    M6 replied in 2010/10/25 13:21

  • 風之旋律
  • 您好,謝謝您提供了這麼多有用的CSS。
    我有個問題想請問您:
    http://img529.imageshack.us/img529/1271/44179153.png

    隱藏主控台的語法,可否只隱藏紅色標線的那些資料部份呢?
    發噗區不隱藏可以嗎?
    因為我用您所教學的語法會同時都隱藏起來!
    請問可以只單獨隱藏資料部份嗎?
    謝謝您的解答!
  • 可以,語法:

    /*主控台透明度變化 : 僅資料面板***/
    div#plurk-dashboard {filter:alpha(opacity=0) !important;opacity:0 !important;}
    div#plurk-dashboard:hover {filter:alpha(opacity=100) !important;opacity:1 !important;}

    M6 replied in 2010/10/26 20:43

  • Laz
  • 您好
    想請教一下如何在IE下讓每一則噗的背景半透明,加了!important也沒有效果
    本人在火狐下用沒有問題,不過在IE下就沒有半透明的效果
    其他像是噗的頭貼或其他部分就沒這問題

    麻煩了~
  • 嗯,IE似乎不支援CSS語法的透明度顯示,
    或是可以在語法中加上 zoom:1; 試試看?

    M6 replied in 2010/10/26 20:45

  • Laz
  • 您好 我是上一篇問ie的透明語法的那位
    由於看到這個噗才發現似乎可行
    http://www.plurk.com/kanden
    (借轉抱歉)
  • Laz
  • 加了 zoom:1; 就可以了 感激不盡Orz
  • ^ ^

    M6 replied in 2010/10/27 08:25

  • : )
  • ^^

    Hey~ 有個問題想請教您:

    /*語助詞*/
    .q_says {
    background: transparent
    ;
    border-right: 1px solid #ff85c7;
    border-top: 1px solid #ff85c7;
    border-bottom: 1px solid #ff85c7;
    border-left: 1px solid #ff85c7;
    color: #ff85c7!important;
    }

    .q_wants,.q_has,.q_wishes,.q_is,.q_will,.q_asks,.q_hopes,.q_gives,.q_likes,.q_was,.q_wonders,.q_shares,.q_had,.q_thinks,.q_loves,.q_hates,.q_asks,.q_needs,.q_feels{background: transparent !important; background-color: #FFF !important; color: #FFF !important; }

    以上是我Plurk發文區旁邊的「說」、「想要」、「需要」、「喜歡」‧‧‧等的CSS,

    我想要裡面全部的選項背景都是透明的、字體顏色也自設,

    但目前只有「說」的背景是透明的,

    可是上面第二段的語法背景已經設定成透明了不是嗎??

    為什麼我這邊看到它還是有背景底色呢?

    我之前也試過把第二段語法刪掉,

    複製第一段「says」的CSS,

    把它改成「wants」,

    但還是跟改之前一樣 ~

    請問我是語法錯了還是其他什麼問題呢?

    可以請您給我裡面全部的選項背景都是透明的、字體顏色也自設的正確CSS嗎?

    謝謝您了 ^^
  • 已經整理並更新於文章中囉~
    請參考 http://m66660000.pixnet.net/blog/post/32763690 這篇文的最後面

    ^W^

    M6 replied in 2010/10/31 16:14

  • : )
  • 謝謝~ 我看到了^^ 是關於這部份的CSS全部都要貼嗎 ?

    因為我從裡面一些地方去改背景和顏色設定

    改完後還是一樣耶~~
  • 目前貼上的CSS語法中,語助詞各選項的背景已經都拿掉囉,所以是哪部份改設定卻沒變呢?

    M6 replied in 2010/10/31 18:02

  • :)
  • 我發現不管我怎麼改背景顏色

    它都一直是預設的color不變耶...
  • 背景顏色?是哪部份的背景顏色呢?

    M6 replied in 2010/10/31 18:04

  • : )
  • 我把我原本用的 /*語助詞*/ 語法都換成您提供的 /*語助詞各欄位***/ 的 CSS

    可是裡面的「想要」、「需要」、「喜歡」‧‧‧選項的背景顏色還是它預設的

    我也試著把語助詞裡的background 設定成 transparent 或 #FFFFFF 和加 !important;

    但它只有「說」這個選項的背景底色有變

    其他選項的背景底色還是預設的沒變~
  • 我這邊試是沒問題的喔,可能要查看你使用的全篇CSS,才能找出是否語法有衝突的地方,
    方便的話可以發私噗給我,讓我幫你看看語法內容哪裡出問題好了。
    我的噗浪:http://www.plurk.com/66660000

    M6 replied in 2010/11/01 07:34

  • : )
  • 就算我把「想要」、「需要」、「喜歡」‧‧‧選項的欄位名稱加到「說」裡面

    但它的背景顏色依然是預設的

    是不是有哪邊的CSS也要一起改呢?
  • 欄位名稱是不會影響到語法的,只是標注清楚讓人容易辨識罷了。
    所以,還是要看整體的語法內容才知道狀況囉~

    M6 replied in 2010/11/01 07:35

  • : )
  • 謝謝了 ^^
    那我們噗浪見囉~
  • 1
  • 請問要怎麼改才能像你底下那樣,
    個人資料是一個區塊,karma、好友、fans各一個區塊
    而且華鼠移過去都會有不一樣的區塊顏色
  • /***1. 把主控台的背景先拿掉:***/

    /*主控台--------------------------------------*/
    #plurk-dashboard
    {
    background: transparent;
    border:0;
    }

    /***2. 各區的語法:***/

    /*個人基本資料***/
    #dash-profile
    {
    background:#FFF url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    /*關於你自己***/
    p#relationship_container, #dash-additional-info
    {
    background:#eee url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    p#about_me
    {
    background:#ddd url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    /*統計項目***/
    #dash-stats
    {
    background:#ccc url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    /*朋友區***/
    #dash-friends
    {
    background:#aaa url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    /*粉絲區***/
    #dash-fans
    {
    background:#999 url(http://放要使用的背景圖片);
    border:0px solid #fff; /*框線*/
    }

    /***3. 滑鼠移過去再顯示的效果***/

    /*資料面板透明度變化***/
    div.dash-segment {filter:alpha(opacity=0) !important;opacity:0 !important;zoom:1;}
    div.dash-segment:hover {filter:alpha(opacity=100) !important;opacity:1 !important;zoom:1;}

    M6 replied in 2010/11/02 11:16

  • blest0326
  • 請教一下...外掛的語法可以修改嗎??
    因為我想要讓外掛在部落格的噗浪
    只看的到發出來的訊息跟時間....
    最上面的照片啊
    回應啊
    拜訪XXX時間軸
    還有旁邊滾動的滾輪這些都不想有耶!
    不曉得有沒有辦法呢?
  • 還沒試過改噗浪的外掛,晚點來試試看,如果成功會再分享上來喔~ ^^

    11/10更新:
    將找到的相關工具與資訊,放在新的文章中囉,請參閱~ ^W^

    M6 replied in 2010/11/10 13:09

  • 紅茶
  • 請問一下
    這是我噗浪http://www.plurk.com/wind4418
    我要怎麼將下方個人狀態朋友塊外大那大框線消除掉
    以及將中間左邊的發噗區每日照片搜尋這些隱藏起來??
  • 1. 在 /*主控台--------------------------------------*/
    #plurk-dashboard {border:0 !important;}
    將原本的 border 設定改成 0 !important;

    2. 隱藏該區塊嗎? 還是隱藏標題顯示?
    該區塊的話,語法是:
    /*噗輸入區透明度變化***/
    div#plurk_form {filter:alpha(opacity=0) !important;opacity:0 !important;zoom:1;}
    div#plurk_form:hover {filter:alpha(opacity=100) !important;opacity:1 !important;zoom:1;}

    只隱藏標題:
    /*隱藏發噗區選項標籤***/
    #toggle_tab li, #plurks_pane_li
    {
    filter:alpha(opacity=0) !important;opacity:0 !important;zoom:1;
    height:0 !important;
    width:0 !important;
    overflow:hidden;
    }

    M6 replied in 2010/11/08 09:54

1 2345

本文章限登入者留言,請您選擇上方任一服務帳號登入。