版權所有+保留所有權利_+_+_
© 2010-2015 Created by 如我協力創意工作室 Be Myself Inc.
**版權說明**
-- 我們提供與設計的噗版CSS內容僅供個人自用,請勿改製再分享或用於商業用途 --
((請勿將全部或部份內容直接取用當作自己的設計))
-- 除了個人噗版自用外(修改請註明原CSS碼出處),其它使用方式均未授權,還請務必注意,勿侵權喔~--

單則噗頁面(單則訊息網址獨立頁面),噗浪改了它的樣式設定,所以,原本看起來好好的清爽的版面,會變成~

噗浪亂改了.png

像這樣。

所以,套用之前噗版設計的噗友,有需要的話,請將下段語法複製貼上,先簡單恢復版面樣貌:

/*單則訊息連結頁去背景更正*/
div#plurk_responses h2 a, /*標題連結*/
#plurk_responses div.feed-link a, /*分享連結*/
#plurk_responses ul.responses,  /*回應列表外框*/
#reply_box,  /*回應區*/
#reply_box_holder
{
    background:none !important;
    border:0 !important;
}

使用後:

去背景後.png

 

再來,我們可以做細部設定來達成符合整體版面樣式的要求:

改好ㄌ.png

是不是美觀多了?XD

以下列出語法內容,請大家參考使用,調整適合自己版面的樣子:

 

/*--------------------------------------------------------------回應列表*/

/*回應內容區*/
#plurk_responses ul.responses li  /*每則回應*/
{
    filter:alpha(opacity=70) !important; opacity:0.7 !important; zoom:1;  /*設透明度*/
    border-bottom:1px solid #ddd !important;  /*改底線樣式*/
}

#plurk_responses ul.responses   /*回應區外框*/
{
    filter:alpha(opacity=70) !important; opacity:0.7 !important; zoom:1;
    background:#fff !important;
    -moz-border-radius:2px 11px 2px 11px;  /*圓角設定*/
    -khtml-border-radius:2px 11px 2px 11px;
    -webkit-border-top-left-radius:2px;
    -webkit-border-top-right-radius:11px;
    -webkit-border-bottom-right-radius:2px;
    -webkit-border-bottom-left-radius:11px;

}


/*訊息內連結樣式*/
#plurk_responses ul.responses .message a  
{
    color:#6883c2 !important;
}
#plurk_responses ul.responses .message a:hover  /*滑鼠移至效果*/
{
    color:#693 !important;
}

 

另外,因應噗友的發問,提供可以把整個回應區隱藏起來,滑鼠移過去時再顯現的語法:

/*回應內容區透明度變化*/
#plurk_responses ul.responses
{
    filter:alpha(opacity=0) !important; opacity:0 !important; zoom:1;
}
#plurk_responses ul.responses:hover
{
    filter:alpha(opacity=100) !important; opacity:1 !important; zoom:1;
}


本來看不見.png

這樣可以看見整個背景圖囉~ XD

 

如果使用上有任何問題,歡迎留言,或發私噗給我 ^ ^

http://www.plurk.com/66660000

 

之後如果單則噗頁面還有任何變動,會再更新於此篇,並將補上單噗頁面的相關語法項目供參考。

創作者介紹
M6

金羽銀華

M6 發表在 痞客邦 PIXNET 留言(17) 人氣()


留言列表 (17)

發表留言
  • 您的暱稱 ...
  • 好像又改了
  • 哪裡?剛檢查了一下,應該沒有 : )

    M6 於 2011/01/30 16:16 回覆

  • 阿弟
  • 請問他這個是怎做的?

    http://www.plurk.com/Charlie_The_Unicorn

    圖片可以隨機換耶

    這是怎麼辦到的?
  • 背景圖連結使用程式替換,詳細做法詢問佈景作者會較清楚 :-P

    M6 於 2011/01/30 22:55 回覆

  • 星
  • 整個回應區隱藏那個程式碼放進去但是沒有改變耶!
  • 我剛試過可以,或許有其它語法內容影響呈現,要看CSS才知道問題原因了

    M6 於 2011/02/10 11:31 回覆

  • 星
  • http://www.plurk.com/installDesign/5807705-6950dabfde
    不好意思我真的試過很多次但我真的不太會.....上面是我所套用你們工作室所製作的其中一個樣式,可以麻煩你告訴我是+在哪一段還是需要做什麼修改
  • 我套用後放入語法可以隱藏,直接將 /*回應內容區透明度變化*/ 整段內容複製貼上在語法最後按儲存就可以了

    M6 於 2011/02/10 14:10 回覆

  • 玄夜
  • 想請問一下

    如何在噗浪回應區用上背景圖?
  • 找到你想放的區塊的語法項目,然後將背景圖語法放入項目中。
    background-image: url(這裡放圖片網址);

    M6 於 2011/03/27 18:31 回覆

  • Shinji Himeji
  • 不好意思,想請問格主是如何移除單則訊息上方的白底plurk大標呢?
    位置似乎是在top_header(對CSS不太熟;;
    另外個人是以格主的『Plurk CSS: 2013_基本款背景型2』為底作修改,不過單則訊息的回應欄位似乎不會置中,請問是要修改哪邊的語法呢?
    謝謝>_<
  • 項目名稱是 #top_header,設隱藏語法:#top_header { display : none ; }
    噗浪後來再改過的單則訊息頁面,因為要置放廣告在右側,所以回應欄往左移很久了......
    近期會再整理更新相關修改語法,再發文分享。

    M6 於 2012/07/08 10:15 回覆

  • Shinji Himeji
  • 喔喔成功了,感謝格主>_<
    這邊的教學真的很實用,更新辛苦了!
  • :D

    M6 於 2012/07/08 20:55 回覆

  • yiln425
  • 請問一下...
    單噗頁面下面的 發噗輸入區旁邊的名字要怎麼修改?

    謝謝^^
  • #main_poster .qual_holder, .qual_holder { color: # !important; }
    填入想要使用的顏色代碼即可。

    M6 於 2012/09/30 22:47 回覆

  • 龜龜 許
  • 不好意思請問一下,單則訊息頁面想要將背景改成浮水印的話需要加什麼語法?把語法加在哪個區塊?
    很抱歉我對CSS完全不熟悉,找過一些網路上的語法教學還是不太懂
  • 單則訊息頁面的背景圖通常跟噗主頁面的整體背景圖是一樣的,要單獨改成不同圖的話,可以使用以下語法:
    .permalink { background : url(這邊放要使用的背景圖直接網址) center top no-repeat fixed !important; }
    這行語法中 center top 是指置中靠上對齊, no-repeat 是背景圖不用重複, fixed 是固定背景圖,可自行依需要更改。

    M6 於 2013/06/02 15:11 回覆

  • 龜龜 許
  • 謝謝!依照上面成功更改成我要的樣子了!感謝說明!
  • :D

    M6 於 2013/06/02 18:07 回覆

  • Alice Hsu
  • 不好意思再請教以下3個問題 (皆打在圖上
    http://imgur.com/QXiAMOw

    http://i.imgur.com/9uHIWFN.jpg
  • 詳細要看語法內容才知道是哪個部分要修改,回覆的區塊可以檢查 .list .plurk_cnt 相關的背景 background: 設定,刪去該行即可。
    單則訊息頁中回覆區的文字顏色可以用 ul.responses .message, div.content { color: #111 !important; } 指定試試看。
    誰可以回覆那個區塊去背景的語法:#plurker_info section, div#setComment { background: none !important; border: 0 !important; }

    M6 於 2013/06/05 09:55 回覆

  • Alice Hsu
  • 非常感謝!!!
    現在只剩下 .list .plurk_cnt
    以下是我的語法中的.list .plurk_cnt
    可是沒有 背景 background: 設定
    http://paste.plurk.com/show/tixrjVvZH2s9Kyl9vQKZ/
  • 那 .plurk_cnt 相關的行呢?看看是否有背景設定影響到ㄡ

    M6 於 2013/06/05 13:59 回覆

  • Alice Hsu
  • 謝謝你 上面的問題已經修改好了^^
    另外關於河道和背景的問題
    http://images.plurk.com/D6yh-2jzVEuO20pBYjM4yMCRqK8.jpg
  • 用指定河道寬度試試看:
    #timeline_holder #timeline_cnt { width: 600px !important; }
    可根據螢幕大小調整數值。
    如果不行,應該是整體畫面背景寬度的問題才會出現捲軸,可試試看這個語法:
    body
    {
    width: 100% !important;
    height: 100% !important;
    min-height: 690px !important;
    overflow: hidden !important;
    }

    M6 於 2013/06/06 10:10 回覆

  • 悄悄話
  • 悄悄話
  • 風夢.夜夙乂天使
  • 想問如果只要開啟我自己的單則訊息,每個人的回覆都會重疊到自己的暱稱上面,但是開啟別人的單訊息都不會這樣,要怎樣才能修正這樣的情形呢?
  • 要看語法內容才知道喔,你可以發私噗給我,我再幫你看看。
    我的噗浪:http://www.plurk.com/66660000

    M6 於 2014/02/21 22:15 回覆

  • poiu8023
  • 不好意思 打擾了
    最近噗浪突然改版 導致我的單則噗背景不見了
    GOOGLE後找到這裡
    照著教學試過後 背景還是沒有回來
    因為不懂CSS所以也不知道問題在哪
    所以想向格主求救

    直接貼上目前使用的語法
    http://paste.plurk.com/show/1909973/

    希望還能救回來(艸
  • 單則噗的語法目前無法用自訂佈景來調整喔,可以參見 http://m66660000.pixnet.net/blog/post/43557262 這篇文章說明。

    M6 於 2014/06/15 09:16 回覆

找更多相關文章與討論