2012年6月14日 星期四

文章頂頁數統計、預覽字色、背景語法


喜歡原創 不隨波遂流!

如有引用請用原文、留言!

重人重他, 讓相處愉快!任何人從任何途徑節錄本人原創語法作學教、分發, 請帶上本 blog logo 連結, 注明出處, 或作一次正確引用, 否則視作侵權, 將考慮交客戶服務部處理! 後果自負!!
*      *      *

不少網友慣用的自定欄位輸入空間巳經爆滿, 請自行掉配空間! 在其他自定欄位輸入語法, 繼續美化!

記得將所需語法全部加入一個自定欄位放於總共一對 <style></style> 之間包着即可!!

升級版正文頂上設有頁數統計及預覽, 猜大部份島主及 bloggers 都不會去細意!

這個設置在版面當眼處, 看上去跟美美的版面不和稭, 更是要美化的時候!

一寸光音一寸金, 本文語法一次過示範多部份效果以供學習, 若一刻未能消化, 請引用回去細閱, 並找到你需要用上的語法部份, 以明快的構思去美化!



欄位名稱、語法動作順序中、英對照! 中文註解於消化後, 請只用英文部份, 省卻語法輸入空間!

*      *      *
圖解:



語法:

/*刪除文章頂預覽欄位*/
#article-top-nav{display:none;}


/*所在篇數字色*/
#article-top-nav .hd em{color:green;}

/*總共幾篇字色*/
#article-top-nav .hd{color:purple;}


/*清除灰色背景及預覽字色*/
#article-top-nav .ft .action-carousel-show{background:none;color:skyblue;}


/*預覽下拉箭咀*/
#article-top-nav .ft .action-carousel-show .ico{display:none;}

*      *      *

在測試時發現不錯效果! 只要消除預覽部份, 忝圖夠高夠濶可一併遮蓋頁數統計, 不需細項調控


如圖: 按圖觀看及取圖片網址 width:272px;height:97px;



語法:
/*預覽欄加圖、消除預覽部份*/
#article-top-nav .ft{background:url(圖片網址);width:濶度數字px;height:高度數字px;}


#article-top-nav .ft .action-carousel-show{display:none;}



如果你的圖沒上圖這麼濶,
可用如下語法:

#article-top-nav .ft{background:url(圖片網址) center no-repeat;height:高度數字px;}

#article-top-nav .ft .action-carousel-show{display:none;}

***測試、制作及編寫下過心機, 用了時間,

引用語法或文章資料請連同我 blog Logo  一併帶走!

22 則留言 :

  1. 先收起.好靚呀
    [版主回覆06/15/2012 09:06:54]客氣了! 這篇星期六晚會公開! ^^

    回覆刪除
  2. 謝謝分享~~
    [版主回覆06/15/2012 09:08:36]早晨! 一陣子沒見, 過來你處先 ^^

    回覆刪除
  3. 我還在學習中....謝謝您的教學....
    [版主回覆06/15/2012 09:10:24]早晨 祝學習愉快!

    回覆刪除
  4. 晚安 ! 雅姬蘭.. 謝謝好詳細的用心教導.. 會好好嘗試.
    [版主回覆06/15/2012 09:11:50]早晨! 別客氣, 祝學習愉快! ^^

    回覆刪除
  5. 又學到野
    [版主回覆06/16/2012 10:24:39]早晨!

    回覆刪除
  6. Akina.. 整到喇 ! 謝謝 !
    晚安安.. Zzz.
    [版主回覆06/16/2012 10:26:02]恭喜! 早晨 ^^ 祝週末愉快!

    回覆刪除
  7. 晚安!您好!祝父親節愉快!...還沒有學好!
    [版主回覆06/16/2012 23:27:20]晚安! ^^ 父親節快樂!

    回覆刪除
  8. 晚安 ! 雅姬蘭..
    [版主回覆06/16/2012 23:27:53]晚安! 祝父親節快樂 !

    回覆刪除
  9. 晚安 ! 雅姬蘭.. 祝週末愉快!
    [版主回覆06/17/2012 10:32:28]早晨! 祝週日愉快, 父親節快樂! ^^

    回覆刪除
  10. 甘快有新語法
    謝謝啊!
    [版主回覆06/17/2012 10:33:40]早晨! ^^ 語法很多, 寫到有點倦, 打算放緩了! 祝週末愉快!

    回覆刪除
  11. 我回家啦my Love friend good night zz ...抱抱錫錫呀
    靚靚的愛...因有大家在...天天歡樂笑...人生多美妙...
    [版主回覆06/17/2012 10:35:21]早晨! 父親節快樂, 美滿又一天!

    回覆刪除
  12. Pandora 香傭講法文2012年6月17日 凌晨1:27

    thanks for sharing again^^
    [版主回覆06/17/2012 10:38:14]早晨! 祝你的書大受歡迎 happy father day!

    回覆刪除
  13. ice may may 雪美美、子格格2012年6月17日 上午11:35

    你好叻! 祝節日愉快!
    [版主回覆06/17/2012 12:08:30]早晨! 比你發現都算叻 祝週日愉快

    回覆刪除
  14. 有新語法...父親節快樂!
    [版主回覆06/17/2012 19:43:13]有時間你都玩吓 ^^ 父親節快樂!

    回覆刪除
  15. 雅姬蘭,妳好叻! 祝週日愉快!
    [版主回覆06/17/2012 19:44:20]謝謝! 黃昏好, 祝過上快樂父親節!

    回覆刪除
  16. 你好叻呀!
    我完全未玩過css,唔知點樣開始!
    [版主回覆06/18/2012 11:43:50]別這樣說吧! 放 mouse 到圖片上按右健, 點圖片資訊就看到了!
    .
    我的文有連圖一套的, 把語法貼到自定欄位裏儲存就見到效果了! 最多人喜歡的回應箱設定, 你不防一試啊! http://blog.yahoo.com/iakina/articles/627336
    .
    也謝謝你答覆啊!
    [Daisy回覆06/18/2012 10:13:33]我連這樣也未懂,好白痴呀!
    .
    名字叫「活流電」。多數都是不痛的,而且好舒服。只是做到頭上,有時會痛,但都要忍一下,才對自己有益。
    [版主回覆06/17/2012 21:31:22]謝謝! 基本上你懂得換語法裏的圖片網址高、濶便可以了! ^^
    .
    活電流痛不痛的?

    回覆刪除
  17. 美滿又一天快快樂樂每一天...

    回覆刪除
  18. 雅姬蘭, 祝週一愉快!

    回覆刪除
  19. 多謝分享!
    取用了.....#article-top-nav{display:none;}
    [版主回覆06/22/2012 11:03:56]早晨! 用到就好, 祝端午節快樂 ^^

    回覆刪除
  20. 全都引用了,THX
    [版主回覆06/24/2012 21:27:21]謝謝! 祝你生活愉快!

    回覆刪除
  21. 引用了
    [版主回覆07/02/2012 21:25:35]知了! 祝你過了個愉快假期 ^^

    回覆刪除
  22. 雅姬蘭 朋友:謝分享....謝無私教學

    回覆刪除